diff --git a/.cursor/rules/frontend-architecture.mdc b/.cursor/rules/frontend-architecture.mdc
new file mode 100644
index 0000000..09e08e6
--- /dev/null
+++ b/.cursor/rules/frontend-architecture.mdc
@@ -0,0 +1,92 @@
+---
+description: Frontend blok ve section mimarisi kuralları. Yeni blok eklerken veya sayfa yapısı kurarken bu kuralları uygula.
+globs: resources/views/components/blocks/**/*.blade.php, app/Filament/**/*.php, resources/views/templates/**/*.blade.php
+---
+
+# Frontend Architecture Rules
+
+Bu kurallar, projenin Blok (Block) ve Bölüm (Section) tabanlı mimarisini tanımlar. Sayfa oluştururken bu standartlara uyulmalıdır.
+
+## 1. Blok (Block) Yapısı
+
+Sistem, `resources/views/components/blocks/` altında bulunan hazır Blade bileşenleri üzerine kuruludur.
+
+### Mevcut Bloklar ve Kullanımları
+- **Hero:** Ana başlık, büyük görsel ve CTA butonları.
+- **Features:** İkonlu özellik kutuları grid yapısı.
+- **Stats:** Sayısal istatistikler ve sayaçlar.
+- **Testimonials:** Müşteri yorumları ve referanslar.
+- **Pricing:** Fiyatlandırma tabloları.
+- **CTA:** Aksiyon çağrısı bantları.
+- **Gallery:** Proje veya görsel galerisi.
+- **Team:** Ekip üyeleri listesi.
+- **Contact:** İletişim bilgileri ve formu.
+
+### Blok Geliştirme Kuralları
+1. **Component Yapısı:** Her blok `resources/views/components/blocks/{type}.blade.php` konumunda olmalıdır.
+2. **Veri Alımı:** Bloklar veriyi sadece `$data` prop'u üzerinden almalıdır:
+   ```blade
+   @props(['data' => []])
+   {{-- Erişim: $data['title'] --}}
+   ```
+3. **Null Check:** Tüm veri alanları için `isset` veya `??` kontrolü yapılmalıdır.
+   ```blade
+   {{ $data['title'] ?? '' }}
+   @if(isset($data['image'])) ... @endif
+   ```
+
+## 2. Section Builder ve Veri Yapısı
+
+Admin panelinde "Section Builder" kullanılarak veriler JSON formatında tutulur.
+
+### Veri Formatı (JSON)
+Veriler `sections` sütununda veya `parsed_sections` attribute'unda şu formatta işlenir:
+
+```json
+[
+  {
+    "type": "hero",
+    "data": {
+      "title": "Başlık",
+      "subtitle": "Alt Başlık",
+      "background_image": "assets/img/bg.jpg"
+    }
+  }
+]
+```
+
+### Key İsimlendirme Kuralları (ÖNEMLİ)
+Veri anahtarları (keys) her zaman **İngilizce** ve **snake_case** olmalıdır:
+- ✅ `title`, `sub_title`, `button_text`, `image_url`
+- ❌ `baslik`, `altBaslik`, `butonYazisi`, `resim`
+
+### Önerilen Value Tipleri
+Admin panelinde alan tanımlarken doğru tipleri seçin:
+- **Kısa Metinler:** `Text` (title, badge)
+- **Uzun Metinler:** `Textarea` (description)
+- **Formatlı İçerik:** `Rich Text` veya `HTML` (content)
+- **Görseller:** `Image` (background_image, icon)
+- **Linkler:** `URL` (button_url)
+
+## 3. Blade Entegrasyonu
+
+Sayfa şablonlarında (örneğin `home.blade.php`) blokları render ederken dinamik yapı kullanılmalıdır:
+
+```blade
+@foreach($page->parsed_sections as $section)
+    @if(view()->exists("components.blocks.{$section['type']}"))
+        <x-dynamic-component 
+            :component="'blocks.'.$section['type']" 
+            :data="$section['data']" 
+        />
+    @endif
+@endforeach
+```
+
+## 4. Stil Özelleştirme
+Bloklar, dışarıdan gelen stil parametrelerini desteklemelidir:
+- `bg_class`: Arka plan rengi (örn: `!bg-[#f0f0f8]`)
+- `column_class`: Grid yapısı (örn: `md:w-4/12`)
+- `padding_class`: Boşluklar (örn: `py-14`)
+
+Bu sınıflar Blade içinde ana kapsayıcıya (wrapper) eklenmelidir.
diff --git a/app/Filament/Admin/Resources/Products/Schemas/ProductForm.php b/app/Filament/Admin/Resources/Products/Schemas/ProductForm.php
index 2af3c63..8f4fe3f 100644
--- a/app/Filament/Admin/Resources/Products/Schemas/ProductForm.php
+++ b/app/Filament/Admin/Resources/Products/Schemas/ProductForm.php
@@ -11,8 +11,8 @@ use Filament\Schemas\Components\Section;
 use App\Filament\Admin\Resources\Components\TranslationTabs;
 use App\Models\ProductCategory;
 use Illuminate\Support\Str;
-use Filament\Forms\Get;
-use Filament\Forms\Set;
+use Filament\Schemas\Components\Utilities\Get;
+use Filament\Schemas\Components\Utilities\Set;
 
 class ProductForm
 {
diff --git a/app/Filament/Admin/Resources/SiteTranslations/Pages/CreateSiteTranslation.php b/app/Filament/Admin/Resources/SiteTranslations/Pages/CreateSiteTranslation.php
index 4477b57..14c50c0 100644
--- a/app/Filament/Admin/Resources/SiteTranslations/Pages/CreateSiteTranslation.php
+++ b/app/Filament/Admin/Resources/SiteTranslations/Pages/CreateSiteTranslation.php
@@ -12,3 +12,5 @@ class CreateSiteTranslation extends CreateRecord
 
 
 
+
+
diff --git a/app/Filament/Admin/Resources/SiteTranslations/Pages/EditSiteTranslation.php b/app/Filament/Admin/Resources/SiteTranslations/Pages/EditSiteTranslation.php
index eebf7d8..e95b75e 100644
--- a/app/Filament/Admin/Resources/SiteTranslations/Pages/EditSiteTranslation.php
+++ b/app/Filament/Admin/Resources/SiteTranslations/Pages/EditSiteTranslation.php
@@ -20,3 +20,5 @@ class EditSiteTranslation extends EditRecord
 
 
 
+
+
diff --git a/app/Filament/Admin/Resources/SiteTranslations/Pages/ListSiteTranslations.php b/app/Filament/Admin/Resources/SiteTranslations/Pages/ListSiteTranslations.php
index 24e80cb..3a0324c 100644
--- a/app/Filament/Admin/Resources/SiteTranslations/Pages/ListSiteTranslations.php
+++ b/app/Filament/Admin/Resources/SiteTranslations/Pages/ListSiteTranslations.php
@@ -20,3 +20,5 @@ class ListSiteTranslations extends ListRecords
 
 
 
+
+
diff --git a/app/Filament/Admin/Resources/SiteTranslations/Schemas/SiteTranslationForm.php b/app/Filament/Admin/Resources/SiteTranslations/Schemas/SiteTranslationForm.php
index 6e04763..c4cef35 100644
--- a/app/Filament/Admin/Resources/SiteTranslations/Schemas/SiteTranslationForm.php
+++ b/app/Filament/Admin/Resources/SiteTranslations/Schemas/SiteTranslationForm.php
@@ -44,3 +44,5 @@ class SiteTranslationForm
 
 
 
+
+
diff --git a/lang/en/product_categories.php b/lang/en/product_categories.php
index 8b0cffd..06776fd 100644
--- a/lang/en/product_categories.php
+++ b/lang/en/product_categories.php
@@ -22,3 +22,5 @@ return [
 
 
 
+
+
diff --git a/lang/en/products.php b/lang/en/products.php
index 194c7ee..11b4d2b 100644
--- a/lang/en/products.php
+++ b/lang/en/products.php
@@ -29,3 +29,5 @@ return [
 
 
 
+
+
diff --git a/lang/tr/product_categories.php b/lang/tr/product_categories.php
index 0e27675..8a036af 100644
--- a/lang/tr/product_categories.php
+++ b/lang/tr/product_categories.php
@@ -22,3 +22,5 @@ return [
 
 
 
+
+
diff --git a/lang/tr/products.php b/lang/tr/products.php
index cc405dc..3bcda55 100644
--- a/lang/tr/products.php
+++ b/lang/tr/products.php
@@ -29,3 +29,5 @@ return [
 
 
 
+
+
diff --git a/public/assets/css/style.css b/public/assets/css/style.css
index d2e6f2c..50281de 100644
--- a/public/assets/css/style.css
+++ b/public/assets/css/style.css
@@ -3322,8 +3322,8 @@
   .border-\[\#343f52\] {
     border-color: #343f52;
   }
-  .border-\[\#3f78e0\] {
-    border-color: #3f78e0;
+  .border-\[\#e31e24\] {
+    border-color: #e31e24;
   }
   .border-\[\#7cb798\] {
     border-color: #7cb798;
@@ -3430,8 +3430,8 @@
   .border-b-\[rgba\(164\,174\,198\,0\.2\)\] {
     border-bottom-color: rgba(164,174,198,0.2);
   }
-  .border-l-\[\#3f78e0\] {
-    border-left-color: #3f78e0;
+  .border-l-\[\#e31e24\] {
+    border-left-color: #e31e24;
   }
   .\!bg-\[\#5daed5\] {
     background-color: #5daed5 !important;
@@ -3442,8 +3442,8 @@
   .\!bg-\[\#343f52\] {
     background-color: #343f52 !important;
   }
-  .\!bg-\[\#3f78e0\] {
-    background-color: #3f78e0 !important;
+  .\!bg-\[\#e31e24\] {
+    background-color: #e31e24 !important;
   }
   .\!bg-\[\#7cb798\] {
     background-color: #7cb798 !important;
@@ -3703,8 +3703,8 @@
   .bg-\[\#343f52\] {
     background-color: #343f52;
   }
-  .bg-\[\#3f78e0\] {
-    background-color: #3f78e0;
+  .bg-\[\#e31e24\] {
+    background-color: #e31e24;
   }
   .bg-\[\#e31e24\] {
     background-color: #e31e24;
@@ -3973,8 +3973,8 @@
     --tw-gradient-position: in oklab;
     background-image: radial-gradient(var(--tw-gradient-stops));
   }
-  .\!bg-\[radial-gradient\(\#3f78e0_2px\,transparent_2\.5px\)\] {
-    background-image: radial-gradient(#3f78e0 2px,transparent 2.5px) !important;
+  .\!bg-\[radial-gradient\(\#e31e24_2px\,transparent_2\.5px\)\] {
+    background-image: radial-gradient(#e31e24 2px,transparent 2.5px) !important;
   }
   .\!bg-\[radial-gradient\(\#54a8c7_2px\,transparent_2\.5px\)\] {
     background-image: radial-gradient(#54a8c7 2px,transparent 2.5px) !important;
@@ -3982,8 +3982,8 @@
   .\!bg-\[radial-gradient\(\#747ed1_2px\,transparent_2\.5px\)\] {
     background-image: radial-gradient(#747ed1 2px,transparent 2.5px) !important;
   }
-  .bg-\[radial-gradient\(\#3f78e0_2px\,transparent_2\.5px\)\] {
-    background-image: radial-gradient(#3f78e0 2px,transparent 2.5px);
+  .bg-\[radial-gradient\(\#e31e24_2px\,transparent_2\.5px\)\] {
+    background-image: radial-gradient(#e31e24 2px,transparent 2.5px);
   }
   .bg-\[radial-gradient\(\#45c4a0_2px\,transparent_2\.5px\)\] {
     background-image: radial-gradient(#45c4a0 2px,transparent 2.5px);
@@ -4130,8 +4130,8 @@
   .stroke-\[\#343f52\] {
     stroke: #343f52;
   }
-  .stroke-\[\#3f78e0\] {
-    stroke: #3f78e0;
+  .stroke-\[\#e31e24\] {
+    stroke: #e31e24;
   }
   .stroke-\[\#54a8c7\] {
     stroke: #54a8c7;
@@ -5743,8 +5743,8 @@
   .\!text-\[\#3b768b\] {
     color: #3b768b !important;
   }
-  .\!text-\[\#3f78e0\] {
-    color: #3f78e0 !important;
+  .\!text-\[\#e31e24\] {
+    color: #e31e24 !important;
   }
   .\!text-\[\#45c4a0\] {
     color: #45c4a0 !important;
@@ -5833,8 +5833,8 @@
   .text-\[\#343f52\] {
     color: #343f52;
   }
-  .text-\[\#3f78e0\] {
-    color: #3f78e0;
+  .text-\[\#e31e24\] {
+    color: #e31e24;
   }
   .text-\[\#45c4a0\] {
     color: #45c4a0;
@@ -7078,10 +7078,10 @@
       border-style: solid;
     }
   }
-  .before\:border-\[\#3f78e0\] {
+  .before\:border-\[\#e31e24\] {
     &::before {
       content: var(--tw-content);
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .before\:border-\[\#262b32\] {
@@ -7150,10 +7150,10 @@
       background-color: #343f52;
     }
   }
-  .before\:bg-\[\#3f78e0\] {
+  .before\:bg-\[\#e31e24\] {
     &::before {
       content: var(--tw-content);
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .before\:bg-\[\#7cb798\] {
@@ -7291,7 +7291,7 @@
   .before\:bg-\[url\(\.\/assets\/img\/photos\/lines\.png\)\] {
     &::before {
       content: var(--tw-content);
-      background-image: url(assets/img/photos/lines.png);
+      background-image: url(../assets/img/photos/lines.png);
     }
   }
   .before\:bg-cover {
@@ -7423,10 +7423,10 @@
       font-weight: var(--font-weight-normal);
     }
   }
-  .before\:\!text-\[\#3f78e0\] {
+  .before\:\!text-\[\#e31e24\] {
     &::before {
       content: var(--tw-content);
-      color: #3f78e0 !important;
+      color: #e31e24 !important;
     }
   }
   .before\:\!text-\[\#54a8c7\] {
@@ -10264,10 +10264,10 @@
       border-style: solid;
     }
   }
-  .after\:border-\[\#3f78e0\] {
+  .after\:border-\[\#e31e24\] {
     &::after {
       content: var(--tw-content);
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .after\:border-\[\#262b32\] {
@@ -10348,10 +10348,10 @@
       background-color: #ffffff !important;
     }
   }
-  .after\:bg-\[\#3f78e0\] {
+  .after\:bg-\[\#e31e24\] {
     &::after {
       content: var(--tw-content);
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .after\:bg-\[\#e0e9fa\] {
@@ -10531,10 +10531,10 @@
       color: #343f52 !important;
     }
   }
-  .after\:\!text-\[\#3f78e0\] {
+  .after\:\!text-\[\#e31e24\] {
     &::after {
       content: var(--tw-content);
-      color: #3f78e0 !important;
+      color: #e31e24 !important;
     }
   }
   .after\:\!text-\[\#7cb798\] {
@@ -10742,10 +10742,10 @@
       }
     }
   }
-  .hover\:\!border-\[\#3f78e0\] {
+  .hover\:\!border-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
-        border-color: #3f78e0 !important;
+        border-color: #e31e24 !important;
       }
     }
   }
@@ -10903,10 +10903,10 @@
       }
     }
   }
-  .hover\:bg-\[\#3f78e0\] {
+  .hover\:bg-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
-        background-color: #3f78e0;
+        background-color: #e31e24;
       }
     }
   }
@@ -11057,10 +11057,10 @@
       }
     }
   }
-  .hover\:\!text-\[\#3f78e0\] {
+  .hover\:\!text-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
-        color: #3f78e0 !important;
+        color: #e31e24 !important;
       }
     }
   }
@@ -11249,12 +11249,12 @@
       }
     }
   }
-  .hover\:after\:\!text-\[\#3f78e0\] {
+  .hover\:after\:\!text-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
         &::after {
           content: var(--tw-content);
-          color: #3f78e0 !important;
+          color: #e31e24 !important;
         }
       }
     }
@@ -11517,9 +11517,9 @@
       border-color: #343f52;
     }
   }
-  .active\:border-\[\#3f78e0\] {
+  .active\:border-\[\#e31e24\] {
     &:active {
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .active\:border-\[\#45c4a0\] {
@@ -11597,9 +11597,9 @@
       background-color: #343f52;
     }
   }
-  .active\:bg-\[\#3f78e0\] {
+  .active\:bg-\[\#e31e24\] {
     &:active {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .active\:bg-\[\#45c4a0\] {
@@ -11682,9 +11682,9 @@
       border-color: #343f52;
     }
   }
-  .disabled\:border-\[\#3f78e0\] {
+  .disabled\:border-\[\#e31e24\] {
     &:disabled {
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .disabled\:border-\[\#45c4a0\] {
@@ -11782,9 +11782,9 @@
       background-color: #343f52;
     }
   }
-  .disabled\:bg-\[\#3f78e0\] {
+  .disabled\:bg-\[\#e31e24\] {
     &:disabled {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .disabled\:bg-\[\#e31e24\] {
@@ -17262,7 +17262,7 @@ hr {
   opacity: 100%;
 }
 .h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
-  margin-top: calc(var(--spacing) * 0);
+  margin-top: calc(var(--spacing) * 2);
   margin-bottom: calc(var(--spacing) * 2);
   --tw-leading: 1.2;
   line-height: 1.2;
@@ -17330,7 +17330,7 @@ a {
   text-decoration-line: none;
 }
 a:hover {
-  color: #3f78e0;
+  color: #e31e24;
 }
 a:not([href]):not([class]),a:not([href]):not([class]):hover {
   color: inherit;
@@ -17700,10 +17700,10 @@ textarea.form-control-sm {
   background-repeat: no-repeat;
   vertical-align: top;
   &:checked {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:checked {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
   &:focus {
     border-color: rgba(8,60,130,0.1);
@@ -17742,8 +17742,8 @@ textarea.form-control-sm {
   --form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='1.5' fill='%23fff'/%3e%3c/svg%3e");
 }
 .form-check-input[type=checkbox]:indeterminate {
-  border-color: #3f78e0;
-  background-color: #3f78e0;
+  border-color: #e31e24;
+  background-color: #e31e24;
   --form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
 }
 .form-check-input:disabled {
@@ -18360,19 +18360,19 @@ textarea.form-control.is-invalid {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:focus {
     background-color: inherit;
   }
   &:focus {
-    color: #3f78e0;
+    color: #e31e24;
   }
 }
 .dropdown-item.active,.dropdown-item:active {
   background-color: inherit;
-  color: #3f78e0;
+  color: #e31e24;
   text-decoration-line: none;
 }
 .dropdown-item.disabled,.dropdown-item:disabled {
@@ -18392,7 +18392,7 @@ textarea.form-control.is-invalid {
   padding-left: 1.5rem;
   font-size: 0.7rem;
   white-space: nowrap;
-  color: #3f78e0;
+  color: #e31e24;
 }
 .btn-group>.btn {
   position: relative;
@@ -18476,11 +18476,11 @@ textarea.form-control.is-invalid {
   transition-timing-function: var(--ease-in-out);
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:focus {
-    color: #3f78e0;
+    color: #e31e24;
   }
   &:focus-visible {
     --tw-shadow: 0 0 0 0.25rem var(--tw-shadow-color, rgba(63,120,224,0.25));
@@ -18522,7 +18522,7 @@ textarea.form-control.is-invalid {
 .nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active {
   border-color: rgba(164,174,198,0.2);
   background-color: var(--color-white);
-  color: #3f78e0;
+  color: #e31e24;
 }
 .nav-tabs .dropdown-menu {
   margin-top: calc(-1 * 1px);
@@ -18537,7 +18537,7 @@ textarea.form-control.is-invalid {
 }
 .nav-pills .nav-link.active,.nav-pills .show>.nav-link {
   background-color: var(--color-white);
-  color: #3f78e0;
+  color: #e31e24;
 }
 .nav-underline {
   gap: 1rem;
@@ -18597,10 +18597,10 @@ textarea.form-control.is-invalid {
   padding-block: calc(var(--spacing) * 0);
   font-size: 0.7rem;
   white-space: nowrap;
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-brand:focus,.navbar-brand:hover {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-nav {
   margin-bottom: calc(var(--spacing) * 0);
@@ -18614,7 +18614,7 @@ textarea.form-control.is-invalid {
   color: #343f52;
 }
 .navbar-nav .nav-link.active,.navbar-nav .nav-link.show {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-nav .dropdown-menu {
   position: static;
@@ -18812,7 +18812,7 @@ textarea.form-control.is-invalid {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:focus {
@@ -18822,7 +18822,7 @@ textarea.form-control.is-invalid {
     background-color: #ffffff;
   }
   &:focus {
-    color: #3f78e0;
+    color: #e31e24;
   }
   &:focus {
     --tw-shadow: unset;
@@ -18839,7 +18839,7 @@ textarea.form-control.is-invalid {
   z-index: 3;
   border-color: rgba(164,174,198,0.2);
   background-color: #ffffff;
-  color: #3f78e0;
+  color: #e31e24;
 }
 .disabled>.page-link,.page-link.disabled {
   pointer-events: none;
@@ -19182,16 +19182,16 @@ figure img {
   -webkit-mask-size: auto auto;
 }
 .img-mask.mask-1 img {
-  -webkit-mask-image: url(assets/img/svg/blob.svg);
-  background-image: url(assets/img/svg/blob.svg);
+  -webkit-mask-image: url(../assets/img/svg/blob.svg);
+  background-image: url(../assets/img/svg/blob.svg);
 }
 .img-mask.mask-2 img {
-  -webkit-mask-image: url(assets/img/svg/hex.svg);
-  background-image: url(assets/img/svg/hex.svg);
+  -webkit-mask-image: url(../assets/img/svg/hex.svg);
+  background-image: url(../assets/img/svg/hex.svg);
 }
 .img-mask.mask-3 img {
-  -webkit-mask-image: url(assets/img/svg/blob2.svg);
-  background-image: url(assets/img/svg/blob2.svg);
+  -webkit-mask-image: url(../assets/img/svg/blob2.svg);
+  background-image: url(../assets/img/svg/blob2.svg);
 }
 .table:not(.table-borderless) tbody {
   border-top-style: var(--tw-border-style);
@@ -19223,7 +19223,7 @@ blockquote.text-center.icon-top:before {
   color: #aab0bc;
 }
 .filter:not(.basic-filter) ul li a.active {
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
 }
 .filter:not(.basic-filter).dark-filter ul li+li:before {
   background-color: rgba(255,255,255,.2);
@@ -19255,7 +19255,7 @@ blockquote.text-center.icon-top:before {
   color: #60697b;
 }
 .filter.basic-filter ul li a.active,.filter.basic-filter ul li a:hover {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .filter.basic-filter.dark-filter ul li a.active,.filter.basic-filter.dark-filter ul li a:hover {
   color: var(--color-white);
@@ -19583,7 +19583,7 @@ input,select,textarea {
   flex-wrap: wrap;
 }
 .picker label[for*=size]>input:checked~span {
-  background-color: #3f78e0;
+  background-color: #e31e24;
   color: var(--color-white);
 }
 .picker label[for*=color]>input:checked~span {
@@ -19826,10 +19826,10 @@ button:focus {
   outline: 0;
 }
 .btn-blue.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-sky.btn-expand {
@@ -19938,10 +19938,10 @@ button:focus {
   }
 }
 .btn-primary.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-blue, .btn-sky, .btn-purple, .btn-grape, .btn-violet, .btn-pink, .btn-fuchsia, .btn-red, .btn-orange, .btn-yellow, .btn-green, .btn-leaf, .btn-aqua, .btn-navy, .btn-ash, .btn-white, .btn-primary {
@@ -19955,7 +19955,7 @@ button:focus {
 .btn-soft-blue {
   border-color: #e0e9fa;
   background-color: #e0e9fa;
-  color: #3f78e0;
+  color: #e31e24;
   &:hover {
     @media (hover: hover) {
       border-color: #e0e9fa;
@@ -19968,7 +19968,7 @@ button:focus {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:active {
@@ -19978,18 +19978,18 @@ button:focus {
     background-color: #e0e9fa;
   }
   &:active {
-    color: #3f78e0;
+    color: #e31e24;
   }
 }
 .btn-soft-blue.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     background-color: #e0e9fa;
   }
 }
 .btn-soft-blue.btn-expand i,.btn-soft-blue.btn-expand:before,.btn-soft-blue.btn-expand:hover,.btn-soft-blue.btn-expand:hover:before {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .btn-soft-sky {
   border-color: #e5f4fd;
@@ -20579,7 +20579,7 @@ button:focus {
 .btn-soft-primary {
   border-color: #e0e9fa;
   background-color: #e0e9fa;
-  color: #3f78e0;
+  color: #e31e24;
   &:hover {
     @media (hover: hover) {
       border-color: #e0e9fa;
@@ -20592,7 +20592,7 @@ button:focus {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:active {
@@ -20602,18 +20602,18 @@ button:focus {
     background-color: #e0e9fa;
   }
   &:active {
-    color: #3f78e0;
+    color: #e31e24;
   }
 }
 .btn-soft-primary.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     background-color: #e0e9fa !important;
   }
 }
 .btn-soft-primary.btn-expand i,.btn-soft-primary.btn-expand:before,.btn-soft-primary.btn-expand:hover,.btn-soft-primary.btn-expand:hover:before {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .btn-soft-ash,.btn-white {
   color: #262b32 !important;
@@ -20655,40 +20655,40 @@ button:focus {
 .btn-primary {
   &:hover {
     @media (hover: hover) {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   &:active {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:active {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-outline-primary {
-  border-color: #3f78e0;
-  color: #3f78e0;
+  border-color: #e31e24;
+  color: #e31e24;
   &:hover {
     @media (hover: hover) {
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   &:hover {
     @media (hover: hover) {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   &:active {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:active {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
   &:disabled {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:disabled {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-gradient {
@@ -20740,10 +20740,10 @@ button:focus {
   background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0)),linear-gradient(45deg,#08aeea 0,#2af598 100%);
 }
 .gradient-7 {
-  background-image: linear-gradient(100deg,#e31e24 20%,#3f78e0 85%);
+  background-image: linear-gradient(100deg,#e31e24 20%,#e31e24 85%);
 }
 .gradient-7.btn-outline-gradient,.gradient-7.btn-outline-gradient span {
-  background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0)),linear-gradient(100deg,#e31e24 20%,#3f78e0 85%);
+  background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0)),linear-gradient(100deg,#e31e24 20%,#e31e24 85%);
 }
 .gradient-8 {
   background-image: linear-gradient(0deg,#2c46a7,#3757c4);
@@ -20951,7 +20951,7 @@ button:focus {
   border-width: 4px;
   --tw-border-style: solid;
   border-style: solid;
-  border-color: #3f78e0;
+  border-color: #e31e24;
   background-color: inherit;
   --tw-shadow: 0 0 #0000;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -21065,7 +21065,7 @@ button:focus {
   padding-block: calc(var(--spacing) * 0);
 }
 .navbar-expand.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-expand .dropdown-mega,.navbar-expand .navbar-nav {
   position: static;
@@ -21319,7 +21319,7 @@ button:focus {
   font-size: 0.85rem;
 }
 .navbar-light .language-select .dropdown-toggle:after {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .share-dropdown .dropdown-toggle:after {
   display: none;
@@ -21381,11 +21381,11 @@ button:focus {
   font-size: 0.85rem;
 }
 .nav-tabs.nav-tabs-basic .nav-link:focus,.nav-tabs.nav-tabs-basic .nav-link:hover {
-  border-color: #3f78e0;
+  border-color: #e31e24;
 }
 .nav-tabs.nav-tabs-basic .nav-item.show .nav-link,.nav-tabs.nav-tabs-basic .nav-link.active {
-  border-color: #3f78e0;
-  color: #3f78e0;
+  border-color: #e31e24;
+  color: #e31e24;
 }
 .nav-tabs.nav-pills {
   border-color: transparent;
@@ -21478,8 +21478,8 @@ button:focus {
   display: inline-block;
 }
 .navbar.navbar-light.fixed .btn:not(.btn-expand):not(.btn-gradient) {
-  border-color: #3f78e0;
-  background-color: #3f78e0;
+  border-color: #e31e24;
+  background-color: #e31e24;
   color: var(--color-white) !important;
 }
 .navbar.navbar-bg-light {
@@ -21760,7 +21760,7 @@ button.hamburger span,button.hamburger:before {
   font-size: 0.85rem;
   --tw-font-weight: var(--font-weight-bold);
   font-weight: var(--font-weight-bold);
-  color: #3f78e0;
+  color: #e31e24;
   transition-property: all;
   transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
   transition-duration: var(--tw-duration, var(--default-transition-duration));
@@ -21807,7 +21807,7 @@ button.hamburger span,button.hamburger:before {
   }
   &::before {
     content: var(--tw-content);
-    color: #3f78e0;
+    color: #e31e24;
   }
   &::before {
     content: var(--tw-content);
@@ -21854,7 +21854,7 @@ button.hamburger span,button.hamburger:before {
   font-size: 0.85rem;
   --tw-font-weight: var(--font-weight-bold);
   font-weight: var(--font-weight-bold);
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     margin-right: 0.4rem;
@@ -21887,7 +21887,7 @@ button.hamburger span,button.hamburger:before {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
 }
@@ -22063,7 +22063,7 @@ button.hamburger span,button.hamburger:before {
   stroke: rgba(30,34,40,0.06);
 }
 .progressbar.blue svg path:last-child {
-  stroke: #3f78e0;
+  stroke: #e31e24;
 }
 .progressbar.semi-circle.blue svg path:first-child {
   stroke: rgba(63,120,224,0.1);
@@ -22177,7 +22177,7 @@ button.hamburger span,button.hamburger:before {
   stroke: rgba(38,43,50,0.1);
 }
 .progressbar.primary svg path:last-child {
-  stroke: #3f78e0;
+  stroke: #e31e24;
 }
 .progressbar.aqua svg path:last-child {
   stroke: #54a8c7;
@@ -22338,7 +22338,7 @@ button.hamburger span,button.hamburger:before {
   left: -1px;
   border-style: var(--tw-border-style);
   border-width: calc(0.8rem * 0.5) 0 calc(0.8rem * 0.5) 0.4rem;
-  border-left-color: #3f78e0;
+  border-left-color: #e31e24;
 }
 .tooltip .tooltip-arrow::before {
   position: absolute;
@@ -22354,7 +22354,7 @@ button.hamburger span,button.hamburger:before {
 .tooltip {
   pointer-events: none;
   border-radius: 0.4rem;
-  background-color: #3f78e0;
+  background-color: #e31e24;
   padding: 0.5rem 0.75rem;
   font-family: var(--font-Manrope);
   --tw-font-weight: var(--font-weight-medium);
@@ -22373,7 +22373,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before, .bs-tooltip-top .tooltip-arrow::before {
   top: -1px;
   border-width: 0.4rem calc(0.8rem * .5) 0;
-  border-top-color: #3f78e0;
+  border-top-color: #e31e24;
 }
 .tooltip .tooltip-arrow::before {
   position: absolute;
@@ -22391,7 +22391,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before, .bs-tooltip-end .tooltip-arrow::before {
   right: -1px;
   border-width: calc(0.8rem * .5) 0.4rem calc(0.8rem * .5) 0;
-  border-right-color: #3f78e0;
+  border-right-color: #e31e24;
 }
 .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow, .bs-tooltip-bottom .tooltip-arrow {
   top: calc(-1 * 0.4rem);
@@ -22399,7 +22399,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before, .bs-tooltip-bottom .tooltip-arrow::before {
   bottom: -1px;
   border-width: 0 calc(0.8rem * .5) 0.4rem;
-  border-bottom-color: #3f78e0;
+  border-bottom-color: #e31e24;
 }
 .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow, .bs-tooltip-start .tooltip-arrow {
   right: calc(-1 * 0.4rem);
@@ -22409,7 +22409,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before, .bs-tooltip-start .tooltip-arrow::before {
   left: -1px;
   border-width: calc(0.8rem * .5)0 calc(0.8rem * .5) 0.4rem;
-  border-left-color: #3f78e0;
+  border-left-color: #e31e24;
 }
 .popover {
   z-index: 1070;
@@ -22695,7 +22695,7 @@ a.hover-2:hover:before {
   background-color: rgba(63,120,224,.7) !important;
 }
 .swiper-container.nav-color .swiper-button:hover {
-  background-color: #3f78e0 !important;
+  background-color: #e31e24 !important;
 }
 .swiper-container.nav-dark .swiper-button,.swiper-container.nav-dark .swiper-slide figure .item-link {
   background-color: rgba(0,0,0,.3) !important;
@@ -23096,10 +23096,10 @@ img.svg-inject {
   fill: #bfc2c8;
 }
 .solid .fill-primary,.solid .fill-secondary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid.text-blue .fill-primary,.solid.text-blue .fill-secondary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid.text-sky .fill-primary,.solid.text-sky .fill-secondary {
   fill: #5eb9f0;
@@ -23153,22 +23153,22 @@ img.svg-inject {
   fill: #262b32;
 }
 .solid.text-primary .fill-primary,.solid.text-primary .fill-secondary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono .fill-secondary {
   fill: #b2c9f3;
 }
 .solid-mono.text-primary .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono.text-primary .fill-secondary {
   fill: #b2c9f3;
 }
 .solid-mono.text-blue .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono.text-blue .fill-secondary {
   fill: #b2c9f3;
@@ -23288,7 +23288,7 @@ img.svg-inject {
   fill: #5eb9f0;
 }
 .solid-duo.text-blue-pink .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-duo.text-purple-aqua .fill-secondary {
   fill: #8ce0f1;
@@ -23381,7 +23381,7 @@ img.svg-inject {
   fill: #a09ed6 !important;
 }
 .solid-mono.text-primary .fill-primary {
-  fill: #3f78e0 !important;
+  fill: #e31e24 !important;
 }
 .solid-mono.text-primary .fill-secondary {
   fill: #b2c9f3 !important;
@@ -23450,7 +23450,7 @@ img.svg-inject {
   fill: #b2c9f3 !important;
 }
 .solid-mono.text-blue .fill-primary {
-  fill: #3f78e0 !important;
+  fill: #e31e24 !important;
 }
 .solid-mono.text-fuchsia .fill-secondary {
   fill: #f5c3e1 !important;
@@ -23644,7 +23644,7 @@ figure.overlay img {
   background-image: linear-gradient(45deg,#08aeea 0,#2af598 100%);
 }
 .overlay.overlay-gradient-7 span.bg {
-  background-image: linear-gradient(100deg,#e31e24 20%,#3f78e0 85%);
+  background-image: linear-gradient(100deg,#e31e24 20%,#e31e24 85%);
 }
 .overlay.overlay-gradient-8 span.bg {
   background-image: linear-gradient(0deg,#2c46a7,#3757c4);
@@ -23900,7 +23900,7 @@ video.player {
 }
 .plyr__control--overlaid:focus, .plyr__control--overlaid:hover {
   background-color: var(--color-white) !important;
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
   --tw-shadow: 0 0 1.25rem var(--tw-shadow-color, rgba(30,34,40,0.04));
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   transition-property: all;
@@ -24039,7 +24039,7 @@ video.player {
   inset-block: calc(var(--spacing) * 0);
   left: calc(var(--spacing) * 0);
   width: 0.6rem;
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     top: 0.2rem;
@@ -24168,7 +24168,7 @@ table.shopping-cart td {
   background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#fab758 1.6px,#fab758 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
 }
 .bg-line.blue {
-  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#3f78e0 1.6px,#3f78e0 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
+  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#e31e24 1.6px,#e31e24 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
 }
 .bg-dot.sky {
   background-image: radial-gradient(#5eb9f0 2px,transparent 2.5px);
@@ -24192,10 +24192,10 @@ table.shopping-cart td {
   background-image: radial-gradient(#fab758 2px, transparent 2.5px);
 }
 .bg-dot.blue {
-  background-image: radial-gradient(#3f78e0 2px, transparent 2.5px);
+  background-image: radial-gradient(#e31e24 2px, transparent 2.5px);
 }
 .bg-line.primary {
-  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#3f78e0 1.6px,#3f78e0 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
+  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#e31e24 1.6px,#e31e24 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
 }
 .bg-line.purple {
   background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) 0.8px,#747ed1 1.6px,#747ed1 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
@@ -24242,10 +24242,10 @@ footer [class*=col-] .widget+.widget {
   color: inherit;
 }
 .sidebar nav .nav-link.active {
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
 }
 .list-unstyled li a.active {
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
 }
 #comments ul.children {
   margin-inline: calc(var(--spacing) * 0);
@@ -24521,7 +24521,7 @@ footer [class*=col-] .widget+.widget {
     padding: calc(var(--spacing) * 0);
   }
   .navbar-expand-xxl.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-xxl .dropdown-mega,.navbar-expand-xxl .navbar-nav {
     position: static;
@@ -24801,7 +24801,7 @@ footer [class*=col-] .widget+.widget {
     font-size: 1.35rem;
   }
   .navbar-expand-xl.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-xl .dropdown-mega,.navbar-expand-xl .navbar-nav {
     position: static;
@@ -27735,7 +27735,7 @@ footer [class*=col-] .widget+.widget {
     border-bottom-left-radius: 0.8rem;
   }
   .navbar-expand-lg.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-lg .dropdown-mega,.navbar-expand-lg .navbar-nav {
     position: static;
@@ -28359,7 +28359,7 @@ footer [class*=col-] .widget+.widget {
     border-radius: var(--radius-2xl);
   }
   .navbar-expand-md.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-md .dropdown-mega,.navbar-expand-md .navbar-nav {
     position: static;
@@ -31130,7 +31130,7 @@ footer [class*=col-] .widget+.widget {
     text-align: center;
   }
   .navbar-expand-sm.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-sm .dropdown-mega,.navbar-expand-sm .navbar-nav {
     position: static;
diff --git a/public/assets/media/movie.html b/public/assets/media/movie.html
index e0ccfe3..f7b0511 100644
--- a/public/assets/media/movie.html
+++ b/public/assets/media/movie.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/about.html b/public/docs/blocks/about.html
index afa039b..c90478e 100644
--- a/public/docs/blocks/about.html
+++ b/public/docs/blocks/about.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -575,7 +575,7 @@
       <div class="container py-12">
         <h2 class="h5">Filter Blocks:</h2>
         <ul class="pl-0 list-none  !mb-0">
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='about.html'>About</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='about.html'>About</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='blog.html'>Blog</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='call-to-action.html'>Call to Action</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='clients.html'>Clients</a></li>
@@ -715,7 +715,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-70px] items-center">
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[70px] !relative">
-            <div class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !absolute counter-wrapper  flex-col max-md:!hidden xl:!flex lg:!flex md:!flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]" style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 170px; height: 170px;">
+            <div class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !absolute counter-wrapper  flex-col max-md:!hidden xl:!flex lg:!flex md:!flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]" style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 170px; height: 170px;">
               <h3 class="!text-white !mb-1 !mt-[-0.5rem] relative z-[3]"><span class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] leading-none !mb-2 xl:!text-[2.2rem] ">20+</span></h3>
               <p class="!text-[0.8rem] font-medium !mb-0">Year Experience</p>
             </div>
@@ -748,17 +748,17 @@
             <p class="!mb-7">Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Vestibulum id ligula porta felis euismod semper. Vestibulum id ligula.</p>
             <div class="flex flex-wrap mx-[-15px] counter-wrapper !mt-[-30px]">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <h3 class="counter !text-[#3f78e0] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
+                <h3 class="counter !text-[#e31e24] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
                 <p class="!text-[0.8rem] font-medium !mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <h3 class="counter !text-[#3f78e0] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
+                <h3 class="counter !text-[#e31e24] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
                 <p class="!text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <h3 class="counter !text-[#3f78e0] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
+                <h3 class="counter !text-[#e31e24] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
                 <p class="!text-[0.8rem] font-medium !mb-0">Expert Employees</p>
               </div>
               <!--/column -->
@@ -783,7 +783,7 @@
                   &#60;div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-70px] items-center"&#62;
                       &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[70px] !relative"&#62;
-                      &#60;div class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !absolute counter-wrapper  flex-col max-md:!hidden xl:!flex lg:!flex md:!flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]" style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 170px; height: 170px;"&#62;
+                      &#60;div class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !absolute counter-wrapper  flex-col max-md:!hidden xl:!flex lg:!flex md:!flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]" style="top: 50%; left: 50%; transform: translate(-50%, -50%); width: 170px; height: 170px;"&#62;
                         &#60;h3 class="!text-white !mb-1 !mt-[-0.5rem] relative z-[3]"&#62;&#60;span class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] leading-none !mb-2 xl:!text-[2.2rem] "&#62;20+&#60;/span&#62;&#60;/h3&#62;
                         &#60;p class="!text-[0.8rem] font-medium !mb-0"&#62;Year Experience&#60;/p&#62;
                       &#60;/div&#62;
@@ -816,17 +816,17 @@
                       &#60;p class="!mb-7"&#62;Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Vestibulum id ligula porta felis euismod semper. Vestibulum id ligula.&#60;/p&#62;
                       &#60;div class="flex flex-wrap mx-[-15px] counter-wrapper !mt-[-30px]"&#62;
                         &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                        &#60;h3 class="counter !text-[#3f78e0] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;7518&#60;/h3&#62;
+                        &#60;h3 class="counter !text-[#e31e24] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;7518&#60;/h3&#62;
                         &#60;p class="!text-[0.8rem] font-medium !mb-0"&#62;Completed Projects&#60;/p&#62;
                         &#60;/div&#62;
                         &#60;!--/column --&#62;
                         &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                        &#60;h3 class="counter !text-[#3f78e0] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;3472&#60;/h3&#62;
+                        &#60;h3 class="counter !text-[#e31e24] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;3472&#60;/h3&#62;
                         &#60;p class="!text-[0.8rem] font-medium !mb-0"&#62;Satisfied Customers&#60;/p&#62;
                         &#60;/div&#62;
                         &#60;!--/column --&#62;
                         &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                        &#60;h3 class="counter !text-[#3f78e0] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;2184&#60;/h3&#62;
+                        &#60;h3 class="counter !text-[#e31e24] xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;2184&#60;/h3&#62;
                         &#60;p class="!text-[0.8rem] font-medium !mb-0"&#62;Expert Employees&#60;/p&#62;
                         &#60;/div&#62;
                         &#60;!--/column --&#62;
@@ -957,7 +957,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative xl:!order-2 lg:!order-2">
-            <div class="shape bg-dot primary bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"></div>
+            <div class="shape bg-dot primary bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"></div>
             <div class="flex flex-wrap !relative overlap-grid-2">
               <div class="item xl:w-[70%] xl:z-[3] xl:ml-[30%] xl:!mt-0 lg:w-[70%] lg:z-[3] lg:ml-[30%] lg:!mt-0 md:w-[70%] md:z-[3] md:ml-[30%] md:!mt-0">
                 <figure class="!rounded-[.4rem] shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] relative"><img class="!rounded-[.4rem] " src="../../assets/img/photos/about2.jpg" alt="image"></figure>
@@ -976,15 +976,15 @@
             <div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px]">
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
                 </ul>
               </div>
               <!--/column -->
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
               </div>
               <!--/column -->
@@ -1009,7 +1009,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center"&#62;
                     &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative xl:!order-2 lg:!order-2"&#62;
-                      &#60;div class="shape bg-dot primary bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"&#62;&#60;/div&#62;
+                      &#60;div class="shape bg-dot primary bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"&#62;&#60;/div&#62;
                       &#60;div class="flex flex-wrap !relative overlap-grid-2"&#62;
                       &#60;div class="item xl:w-[70%] xl:z-[3] xl:ml-[30%] xl:!mt-0 lg:w-[70%] lg:z-[3] lg:ml-[30%] lg:!mt-0 md:w-[70%] md:z-[3] md:ml-[30%] md:!mt-0"&#62;
                         &#60;figure class="!rounded-[.4rem] shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] relative"&#62;&#60;img class="!rounded-[.4rem] " src="../../assets/img/photos/about2.jpg" alt="image"&#62;&#60;/figure&#62;
@@ -1028,15 +1028,15 @@
                       &#60;div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px]"&#62;
                       &#60;div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full"&#62;
                         &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0"&#62;
-                        &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Aenean eu leo quam ornare curabitur blandit tempus.&#60;/span&#62;&#60;/li&#62;
-                        &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Nullam quis risus eget urna mollis ornare donec elit.&#60;/span&#62;&#60;/li&#62;
+                        &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Aenean eu leo quam ornare curabitur blandit tempus.&#60;/span&#62;&#60;/li&#62;
+                        &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Nullam quis risus eget urna mollis ornare donec elit.&#60;/span&#62;&#60;/li&#62;
                         &#60;/ul&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full"&#62;
                         &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0"&#62;
-                        &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Etiam porta sem malesuada magna mollis euismod.&#60;/span&#62;&#60;/li&#62;
-                        &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Fermentum massa vivamus faucibus amet euismod.&#60;/span&#62;&#60;/li&#62;
+                        &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Etiam porta sem malesuada magna mollis euismod.&#60;/span&#62;&#60;/li&#62;
+                        &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Fermentum massa vivamus faucibus amet euismod.&#60;/span&#62;&#60;/li&#62;
                         &#60;/ul&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
@@ -1069,12 +1069,12 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Why Choose Us?</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Why Choose Us?</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">A few reasons why our valued customers choose us.</h3>
             <div class="accordion accordion-wrapper" id="accordionExample">
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] !p-[0_0_0_1.1rem] !text-[.85rem] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] !p-[0_0_0_1.1rem] !text-[.85rem] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
@@ -1088,7 +1088,7 @@
               <!--/.accordion-item -->
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
@@ -1102,7 +1102,7 @@
               <!--/.accordion-item -->
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
@@ -1139,12 +1139,12 @@
                     &#60;/div&#62;
                     &#60;!--/column --&#62;
                     &#60;div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full"&#62;
-                      &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3"&#62;Why Choose Us?&#60;/h2&#62;
+                      &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3"&#62;Why Choose Us?&#60;/h2&#62;
                       &#60;h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7"&#62;A few reasons why our valued customers choose us.&#60;/h3&#62;
                       &#60;div class="accordion accordion-wrapper" id="accordionExample"&#62;
                       &#60;div class="card plain accordion-item"&#62;
                         &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne"&#62;
-                        &#60;button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] !p-[0_0_0_1.1rem] !text-[.85rem] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"&#62; Professional Design &#60;/button&#62;
+                        &#60;button class="before:!text-[#e31e24] hover:!text-[#e31e24] !p-[0_0_0_1.1rem] !text-[.85rem] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"&#62; Professional Design &#60;/button&#62;
                         &#60;/div&#62;
                         &#60;!--/.card-header --&#62;
                         &#60;div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample"&#62;
@@ -1158,7 +1158,7 @@
                       &#60;!--/.accordion-item --&#62;
                       &#60;div class="card plain accordion-item"&#62;
                         &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo"&#62;
-                        &#60;button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"&#62; Top-Notch Support &#60;/button&#62;
+                        &#60;button class="before:!text-[#e31e24] hover:!text-[#e31e24] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"&#62; Top-Notch Support &#60;/button&#62;
                         &#60;/div&#62;
                         &#60;!--/.card-header --&#62;
                         &#60;div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample"&#62;
@@ -1172,7 +1172,7 @@
                       &#60;!--/.accordion-item --&#62;
                       &#60;div class="card plain accordion-item"&#62;
                         &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree"&#62;
-                        &#60;button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"&#62; Header and Slider Options &#60;/button&#62;
+                        &#60;button class="before:!text-[#e31e24] hover:!text-[#e31e24] !p-[0_0_0_1.1rem] !text-[.85rem] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"&#62; Header and Slider Options &#60;/button&#62;
                         &#60;/div&#62;
                         &#60;!--/.card-header --&#62;
                         &#60;div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample"&#62;
@@ -1299,7 +1299,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center">
           <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]">
-            <a href="../../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#3f78e0] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#3f78e0] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
+            <a href="../../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e31e24] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e31e24] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
             <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem]" src="../../assets/img/photos/about12.jpg" alt="image"></figure>
           </div>
@@ -1341,7 +1341,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center"&#62;
                     &#60;div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]"&#62;
-                      &#60;a href="../../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#3f78e0] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#3f78e0] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox&#62;&#60;i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"&#62;&#60;/i&#62;&#60;/a&#62;
+                      &#60;a href="../../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e31e24] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e31e24] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox&#62;&#60;i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"&#62;&#60;/i&#62;&#60;/a&#62;
                       &#60;div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "&#62;&#60;/div&#62;
                       &#60;figure class="!rounded-[.4rem] relative z-[2]"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/about12.jpg" alt="image"&#62;&#60;/figure&#62;
                     &#60;/div&#62;
@@ -1602,9 +1602,9 @@
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-4 xl:mr-[-1.25rem] lg:mr-[-1.25rem]">We make spending stress free so you have the perfect control.</h3>
             <p class="!mb-6">Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus. Integer posuere erat a ante venenatis dapibus posuere velit.</p>
             <ul class="pl-0 list-none bullet-bg bullet-soft-primary">
-              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
             </ul>
           </div>
           <!--/column -->
@@ -1657,9 +1657,9 @@
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-4 xl:mr-[-1.25rem] lg:mr-[-1.25rem]"&#62;We make spending stress free so you have the perfect control.&#60;/h3&#62;
                         &#60;p class="!mb-6"&#62;Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus. Integer posuere erat a ante venenatis dapibus posuere velit.&#60;/p&#62;
                         &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary"&#62;
-                        &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Aenean eu leo quam. Pellentesque ornare.&#60;/li&#62;
-                        &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Nullam quis risus eget urna mollis ornare.&#60;/li&#62;
-                        &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Donec id elit non mi porta gravida at eget.&#60;/li&#62;
+                        &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Aenean eu leo quam. Pellentesque ornare.&#60;/li&#62;
+                        &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Nullam quis risus eget urna mollis ornare.&#60;/li&#62;
+                        &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Donec id elit non mi porta gravida at eget.&#60;/li&#62;
                         &#60;/ul&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
@@ -1740,11 +1740,11 @@
             <h3>Why Choose Me?</h3>
             <p>Vestibulum id ligula porta felis euismod semper. Cras mattis consectetur purus sit amet fermentum. Donec ullamcorper nulla non metus auctor fringilla. Nullam id dolor id nibh ultricies. Cras mattis consectetur purus amet fermentum.</p>
             <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam pellentesque.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus tellus ac commodo.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Cras justo odio dapibus ac facilisis in.</li>
+              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam pellentesque.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus tellus ac commodo.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Cras justo odio dapibus ac facilisis in.</li>
             </ul>
           </div>
           <!-- /column -->
@@ -1853,11 +1853,11 @@
           &#60;h3&#62;Why Choose Me?&#60;/h3&#62;
           &#60;p&#62;Vestibulum id ligula porta felis euismod semper. Cras mattis consectetur purus sit amet fermentum. Donec ullamcorper nulla non metus auctor fringilla. Nullam id dolor id nibh ultricies. Cras mattis consectetur purus amet fermentum.&#60;/p&#62;
           &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0"&#62;
-            &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Aenean eu leo quam pellentesque.&#60;/li&#62;
-            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Nullam quis risus eget urna mollis.&#60;/li&#62;
-            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Donec id elit non mi porta gravida.&#60;/li&#62;
-            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Fusce dapibus tellus ac commodo.&#60;/li&#62;
-            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Cras justo odio dapibus ac facilisis in.&#60;/li&#62;
+            &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Aenean eu leo quam pellentesque.&#60;/li&#62;
+            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Nullam quis risus eget urna mollis.&#60;/li&#62;
+            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Donec id elit non mi porta gravida.&#60;/li&#62;
+            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Fusce dapibus tellus ac commodo.&#60;/li&#62;
+            &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Cras justo odio dapibus ac facilisis in.&#60;/li&#62;
           &#60;/ul&#62;
         &#60;/div&#62;
         &#60;!-- /column --&#62;
@@ -1921,7 +1921,7 @@
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">I'm Caitlyn Trunçgil, a photographer specializing in food, drink and product photography.</p>
             <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Vestibulum id ligula.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
           </div>
           <!--/column -->
         </div>
@@ -1937,7 +1937,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="flex flex-row">
                   <div>
-                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
+                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
                   </div>
                   <div>
                     <h4 class="!mb-1">Concept</h4>
@@ -1949,7 +1949,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="flex flex-row">
                   <div>
-                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
+                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
                   </div>
                   <div>
                     <h4 class="!mb-1">Prepare</h4>
@@ -1961,7 +1961,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="flex flex-row">
                   <div>
-                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
+                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
                   </div>
                   <div>
                     <h4 class="!mb-1">Retouch</h4>
@@ -1973,7 +1973,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="flex flex-row">
                   <div>
-                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">4</span></span>
+                    <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">4</span></span>
                   </div>
                   <div>
                     <h4 class="!mb-1">Finalize</h4>
@@ -2011,7 +2011,7 @@
                         &#60;p class="lead !text-[1.05rem] !leading-[1.6] font-medium"&#62;I'm Caitlyn Trunçgil, a photographer specializing in food, drink and product photography.&#60;/p&#62;
                         &#60;p&#62;Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Etiam porta sem malesuada magna mollis euismod. Vestibulum id ligula.&#60;/p&#62;
                         &#60;p&#62;Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean lacinia bibendum nulla sed consectetur. Curabitur blandit tempus porttitor. Lorem ipsum dolor sit amet, consectetur.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Learn More&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Learn More&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
@@ -2027,7 +2027,7 @@
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;1&#60;/span&#62;&#60;/span&#62;
+                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;1&#60;/span&#62;&#60;/span&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h4 class="!mb-1"&#62;Concept&#60;/h4&#62;
@@ -2039,7 +2039,7 @@
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;2&#60;/span&#62;&#60;/span&#62;
+                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;2&#60;/span&#62;&#60;/span&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h4 class="!mb-1"&#62;Prepare&#60;/h4&#62;
@@ -2051,7 +2051,7 @@
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;3&#60;/span&#62;&#60;/span&#62;
+                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;3&#60;/span&#62;&#60;/span&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h4 class="!mb-1"&#62;Retouch&#60;/h4&#62;
@@ -2063,7 +2063,7 @@
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;4&#60;/span&#62;&#60;/span&#62;
+                                &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-4 !mt-1 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;4&#60;/span&#62;&#60;/span&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h4 class="!mb-1"&#62;Finalize&#60;/h4&#62;
@@ -2293,7 +2293,7 @@
           </div>
           <!--/column -->
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[80px]">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]">Who Are We?</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]">Who Are We?</h2>
             <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-5">Company that believes in the power of creative strategy.</h3>
             <p class="!mb-6">Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed.</p>
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px]">
@@ -2352,7 +2352,7 @@
           <!--/column -->
         </div>
         <!--/.row -->
-        <div class="text-center"><a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]">More Details</a></div>
+        <div class="text-center"><a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]">More Details</a></div>
       </div>
       <!-- /.container -->
       <div class="container pb-20 xl:pb-28 lg:pb-28 md:pb-28">
@@ -2386,7 +2386,7 @@
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[80px]"&#62;
-                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]"&#62;Who Are We?&#60;/h2&#62;
+                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]"&#62;Who Are We?&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-5"&#62;Company that believes in the power of creative strategy.&#60;/h3&#62;
                         &#60;p class="!mb-6"&#62;Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed.&#60;/p&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px]"&#62;
@@ -2445,7 +2445,7 @@
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
                     &#60;!--/.row --&#62;
-                    &#60;div class="text-center"&#62;&#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]"&#62;More Details&#60;/a&#62;&#60;/div&#62;
+                    &#60;div class="text-center"&#62;&#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]"&#62;More Details&#60;/a&#62;&#60;/div&#62;
                   &#60;/div&#62;
 &lt;/section&gt;
 &lt;!-- /section --&gt;</code></pre>
@@ -2473,7 +2473,7 @@
             <p class="lead !text-[1.2rem] font-medium !leading-[1.65]">👋 Hello! I'm Camille, a multidisciplinary product designer 🧸 based in New York City 🚕. I’m very passionate about the work 💌 that I do.</p>
             <p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh ut fermentum massa justo sit amet risus.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean lacinia bibendum nulla sed consectetur.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end !mt-2">Learn More <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end !mt-2">Learn More <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
           </div>
           <!--/column -->
         </div>
@@ -2482,14 +2482,14 @@
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mx-auto !mt-[50px]">
             <h2 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !mb-3">My experiences</h2>
             <p class="lead !text-[1.2rem] font-medium !leading-[1.65] xxl:!pr-8">I've had the pleasure to work with companies 🏢 across a variety of industries 🏛️ I'm always interested in new ✨ and exciting adventures 🧨</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end !mt-2">Download Resume <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end !mt-2">Download Resume <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
           </div>
           <!--/column -->
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
             <ul class="timeline xl:table lg:table md:table !w-full !m-0 !p-0 !list-none">
               <li class="relative !pl-8 xl:table-row xl:p-0 lg:table-row lg:p-0 md:table-row md:p-0">
                 <div class="timeline-info meta uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !text-[0.7rem] whitespace-nowrap !mb-2 xl:text-right xl:table-cell xl:align-top xl:!pr-6 lg:text-right lg:table-cell lg:align-top lg:!pr-6 md:text-right md:table-cell md:align-top md:!pr-6">Nov 2017 - Present</div>
-                <div class="timeline-marker absolute w-[0.6rem] !text-[#3f78e0] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#3f78e0] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"></div>
+                <div class="timeline-marker absolute w-[0.6rem] !text-[#e31e24] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#e31e24] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"></div>
                 <div class="table-cell align-top pb-8 xl:!pl-6 lg:!pl-6 md:!pl-6">
                   <h3 class="timeline-title xl:!mt-[-0.25rem] lg:!mt-[-0.25rem] md:!mt-[-0.25rem]">Creative Director at Malory House</h3>
                   <p class="!m-0">Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non euismod id nulla.</p>
@@ -2497,7 +2497,7 @@
               </li>
               <li class="relative !pl-8 xl:table-row xl:p-0 lg:table-row lg:p-0 md:table-row md:p-0">
                 <div class="timeline-info meta uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !text-[0.7rem] whitespace-nowrap !mb-2 xl:text-right xl:table-cell xl:align-top xl:!pr-6 lg:text-right lg:table-cell lg:align-top lg:!pr-6 md:text-right md:table-cell md:align-top md:!pr-6">Sep 2015 - Apr 2017</div>
-                <div class="timeline-marker absolute w-[0.6rem] !text-[#3f78e0] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#3f78e0] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"></div>
+                <div class="timeline-marker absolute w-[0.6rem] !text-[#e31e24] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#e31e24] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"></div>
                 <div class="table-cell align-top pb-8 xl:!pl-6 lg:!pl-6 md:!pl-6">
                   <h3 class="timeline-title xl:!mt-[-0.25rem] lg:!mt-[-0.25rem] md:!mt-[-0.25rem]">Senior Developer at Longwave Studio</h3>
                   <p class="!m-0">Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque.</p>
@@ -2505,7 +2505,7 @@
               </li>
               <li class="relative !pl-8 xl:table-row xl:p-0 lg:table-row lg:p-0 md:table-row md:p-0">
                 <div class="timeline-info meta uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !text-[0.7rem] whitespace-nowrap !mb-2 xl:text-right xl:table-cell xl:align-top xl:!pr-6 lg:text-right lg:table-cell lg:align-top lg:!pr-6 md:text-right md:table-cell md:align-top md:!pr-6">May 2011 - Sep 2015</div>
-                <div class="timeline-marker absolute w-[0.6rem] !text-[#3f78e0] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#3f78e0]"></div>
+                <div class="timeline-marker absolute w-[0.6rem] !text-[#e31e24] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#e31e24]"></div>
                 <div class="table-cell align-top xl:!pl-6 lg:!pl-6 md:!pl-6 !pb-0">
                   <h3 class="timeline-title xl:!mt-[-0.25rem] lg:!mt-[-0.25rem] md:!mt-[-0.25rem]">Junior Developer at Webpaint Media</h3>
                   <p class="!m-0">Cras mattis consectetur purus sit amet fermentum. Donec ullamcorper nulla non metus auctor fringilla. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
@@ -2539,7 +2539,7 @@
                         &#60;p class="lead !text-[1.2rem] font-medium !leading-[1.65]"&#62;👋 Hello! I'm Camille, a multidisciplinary product designer 🧸 based in New York City 🚕. I&#8217;m very passionate about the work 💌 that I do.&#60;/p&#62;
                         &#60;p&#62;Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh ut fermentum massa justo sit amet risus.&#60;/p&#62;
                         &#60;p&#62;Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Aenean lacinia bibendum nulla sed consectetur.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end !mt-2"&#62;Learn More &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end !mt-2"&#62;Learn More &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
@@ -2548,14 +2548,14 @@
                       &#60;div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mx-auto !mt-[50px]"&#62;
                         &#60;h2 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !mb-3"&#62;My experiences&#60;/h2&#62;
                         &#60;p class="lead !text-[1.2rem] font-medium !leading-[1.65] xxl:!pr-8"&#62;I've had the pleasure to work with companies 🏢 across a variety of industries 🏛️ I'm always interested in new &#10024; and exciting adventures 🧨&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end !mt-2"&#62;Download Resume &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end !mt-2"&#62;Download Resume &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#62;
                         &#60;ul class="timeline xl:table lg:table md:table !w-full !m-0 !p-0 !list-none"&#62;
                           &#60;li class="relative !pl-8 xl:table-row xl:p-0 lg:table-row lg:p-0 md:table-row md:p-0"&#62;
                             &#60;div class="timeline-info meta uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !text-[0.7rem] whitespace-nowrap !mb-2 xl:text-right xl:table-cell xl:align-top xl:!pr-6 lg:text-right lg:table-cell lg:align-top lg:!pr-6 md:text-right md:table-cell md:align-top md:!pr-6"&#62;Nov 2017 - Present&#60;/div&#62;
-                            &#60;div class="timeline-marker absolute w-[0.6rem] !text-[#3f78e0] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#3f78e0] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"&#62;&#60;/div&#62;
+                            &#60;div class="timeline-marker absolute w-[0.6rem] !text-[#e31e24] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#e31e24] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"&#62;&#60;/div&#62;
                             &#60;div class="table-cell align-top pb-8 xl:!pl-6 lg:!pl-6 md:!pl-6"&#62;
                               &#60;h3 class="timeline-title xl:!mt-[-0.25rem] lg:!mt-[-0.25rem] md:!mt-[-0.25rem]"&#62;Creative Director at Malory House&#60;/h3&#62;
                               &#60;p class="!m-0"&#62;Nullam vel sem. Nullam vel sem. Integer ante arcu, accumsan a consectetuer eget, posuere ut, mauris. Donec orci lectus, aliquam ut, faucibus non euismod id nulla.&#60;/p&#62;
@@ -2563,7 +2563,7 @@
                           &#60;/li&#62;
                           &#60;li class="relative !pl-8 xl:table-row xl:p-0 lg:table-row lg:p-0 md:table-row md:p-0"&#62;
                             &#60;div class="timeline-info meta uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !text-[0.7rem] whitespace-nowrap !mb-2 xl:text-right xl:table-cell xl:align-top xl:!pr-6 lg:text-right lg:table-cell lg:align-top lg:!pr-6 md:text-right md:table-cell md:align-top md:!pr-6"&#62;Sep 2015 - Apr 2017&#60;/div&#62;
-                            &#60;div class="timeline-marker absolute w-[0.6rem] !text-[#3f78e0] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#3f78e0] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"&#62;&#60;/div&#62;
+                            &#60;div class="timeline-marker absolute w-[0.6rem] !text-[#e31e24] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#e31e24] after:w-px after:content-[''] after:block after:absolute after:left-1 after:top-4 after:bottom-0 after:bg-[rgba(164,174,198,.2)]"&#62;&#60;/div&#62;
                             &#60;div class="table-cell align-top pb-8 xl:!pl-6 lg:!pl-6 md:!pl-6"&#62;
                               &#60;h3 class="timeline-title xl:!mt-[-0.25rem] lg:!mt-[-0.25rem] md:!mt-[-0.25rem]"&#62;Senior Developer at Longwave Studio&#60;/h3&#62;
                               &#60;p class="!m-0"&#62;Donec vitae sapien ut libero venenatis faucibus. ullam dictum felis eu pede mollis pretium. Pellentesque ut neque.&#60;/p&#62;
@@ -2571,7 +2571,7 @@
                           &#60;/li&#62;
                           &#60;li class="relative !pl-8 xl:table-row xl:p-0 lg:table-row lg:p-0 md:table-row md:p-0"&#62;
                             &#60;div class="timeline-info meta uppercase !tracking-[0.02rem] font-bold !text-[#aab0bc] !text-[0.7rem] whitespace-nowrap !mb-2 xl:text-right xl:table-cell xl:align-top xl:!pr-6 lg:text-right lg:table-cell lg:align-top lg:!pr-6 md:text-right md:table-cell md:align-top md:!pr-6"&#62;May 2011 - Sep 2015&#60;/div&#62;
-                            &#60;div class="timeline-marker absolute w-[0.6rem] !text-[#3f78e0] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#3f78e0]"&#62;&#60;/div&#62;
+                            &#60;div class="timeline-marker absolute w-[0.6rem] !text-[#e31e24] left-0 inset-y-0 xl:relative xl:table-cell xl:align-top lg:relative lg:table-cell lg:align-top md:relative md:table-cell md:align-top before:w-[0.55rem] before:h-[0.55rem] before:content-[''] before:block before:absolute before:rounded-[100%] before:left-0 before:top-[0.2rem] before:bg-[#e31e24]"&#62;&#60;/div&#62;
                             &#60;div class="table-cell align-top xl:!pl-6 lg:!pl-6 md:!pl-6 !pb-0"&#62;
                               &#60;h3 class="timeline-title xl:!mt-[-0.25rem] lg:!mt-[-0.25rem] md:!mt-[-0.25rem]"&#62;Junior Developer at Webpaint Media&#60;/h3&#62;
                               &#60;p class="!m-0"&#62;Cras mattis consectetur purus sit amet fermentum. Donec ullamcorper nulla non metus auctor fringilla. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.&#60;/p&#62;
@@ -2615,9 +2615,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/blog.html b/public/docs/blocks/blog.html
index 99874cf..6fd592b 100644
--- a/public/docs/blocks/blog.html
+++ b/public/docs/blocks/blog.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -576,7 +576,7 @@
         <h2 class="h5">Filter Blocks:</h2>
         <ul class="pl-0 list-none  !mb-0">
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='about.html'>About</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='blog.html'>Blog</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='blog.html'>Blog</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='call-to-action.html'>Call to Action</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='clients.html'>Clients</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='contact.html'>Contact</a></li>
@@ -612,17 +612,17 @@
                 </figcaption>
               </figure>
                   <div class="post-header">
-                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                       <a href="#" class="hover" rel="category">Coding</a>
                     </div>
                     <!-- /.post-category -->
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="post-footer">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -639,17 +639,17 @@
                     </figcaption>
                   </figure>
                   <div class="post-header">
-                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                       <a href="#" class="hover" rel="category">Workspace</a>
                     </div>
                     <!-- /.post-category -->
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="post-footer">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -666,17 +666,17 @@
                     </figcaption>
                   </figure>
                   <div class="post-header">
-                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                       <a href="#" class="hover" rel="category">Meeting</a>
                     </div>
                     <!-- /.post-category -->
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ultricies fusce porta elit</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ultricies fusce porta elit</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="post-footer">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -693,16 +693,16 @@
                     </figcaption>
                   </figure>
                   <div class="post-header">
-                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                       <a href="#" class="hover" rel="category">Business Tips</a>
                     </div>
                     <!-- /.post-category -->
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Morbi leo risus porta eget</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Morbi leo risus porta eget</a></h2>
                   </div>
                   <div class="post-footer">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -743,17 +743,17 @@
                             &#60;/figcaption&#62;
                           &#60;/figure&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                   &#60;a href="#" class="hover" rel="category"&#62;Coding&#60;/a&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /.post-category --&#62;
-                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
                               &#60;div class="post-footer"&#62;
                                 &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                   &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;14 Apr 2022&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
+                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
                                 &#60;!-- /.post-meta --&#62;
                               &#60;/div&#62;
@@ -770,17 +770,17 @@
                                 &#60;/figcaption&#62;
                               &#60;/figure&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                   &#60;a href="#" class="hover" rel="category"&#62;Workspace&#60;/a&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /.post-category --&#62;
-                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
                               &#60;div class="post-footer"&#62;
                                 &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                   &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;29 Mar 2022&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
                                 &#60;!-- /.post-meta --&#62;
                               &#60;/div&#62;
@@ -797,17 +797,17 @@
                                 &#60;/figcaption&#62;
                               &#60;/figure&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                   &#60;a href="#" class="hover" rel="category"&#62;Meeting&#60;/a&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /.post-category --&#62;
-                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
                               &#60;div class="post-footer"&#62;
                                 &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                   &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;26 Feb 2022&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
+                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
                                 &#60;!-- /.post-meta --&#62;
                               &#60;/div&#62;
@@ -824,16 +824,16 @@
                                 &#60;/figcaption&#62;
                               &#60;/figure&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                   &#60;a href="#" class="hover" rel="category"&#62;Business Tips&#60;/a&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /.post-category --&#62;
-                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
                               &#60;/div&#62;
                               &#60;div class="post-footer"&#62;
                                 &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                   &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;7 Jan 2022&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
+                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
                                 &#60;!-- /.post-meta --&#62;
                               &#60;/div&#62;
@@ -884,17 +884,17 @@
                     </figcaption>
                   </figure>
                       <div class="post-header">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Coding</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="post-footer">
                         <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                           <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                         </ul>
                         <!-- /.post-meta -->
                       </div>
@@ -911,17 +911,17 @@
                         </figcaption>
                       </figure>
                       <div class="post-header">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Workspace</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="post-footer">
                         <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                           <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                         </ul>
                         <!-- /.post-meta -->
                       </div>
@@ -938,17 +938,17 @@
                         </figcaption>
                       </figure>
                       <div class="post-header">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Meeting</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ultricies fusce porta elit</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ultricies fusce porta elit</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="post-footer">
                         <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                           <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                         </ul>
                         <!-- /.post-meta -->
                       </div>
@@ -965,16 +965,16 @@
                         </figcaption>
                       </figure>
                       <div class="post-header">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Business Tips</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Morbi leo risus porta eget</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Morbi leo risus porta eget</a></h2>
                       </div>
                       <div class="post-footer">
                         <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                           <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                          <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
                         </ul>
                         <!-- /.post-meta -->
                       </div>
@@ -1025,17 +1025,17 @@
                                 &#60;/figcaption&#62;
                               &#60;/figure&#62;
                                   &#60;div class="post-header"&#62;
-                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                       &#60;a href="#" class="hover" rel="category"&#62;Coding&#60;/a&#62;
                                     &#60;/div&#62;
                                     &#60;!-- /.post-category --&#62;
-                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
+                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
                                   &#60;/div&#62;
                                   &#60;!-- /.post-header --&#62;
                                   &#60;div class="post-footer"&#62;
                                     &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                       &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;14 Apr 2022&#60;/span&#62;&#60;/li&#62;
-                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
+                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
                                     &#60;/ul&#62;
                                     &#60;!-- /.post-meta --&#62;
                                   &#60;/div&#62;
@@ -1052,17 +1052,17 @@
                                     &#60;/figcaption&#62;
                                   &#60;/figure&#62;
                                   &#60;div class="post-header"&#62;
-                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                       &#60;a href="#" class="hover" rel="category"&#62;Workspace&#60;/a&#62;
                                     &#60;/div&#62;
                                     &#60;!-- /.post-category --&#62;
-                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
+                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
                                   &#60;/div&#62;
                                   &#60;!-- /.post-header --&#62;
                                   &#60;div class="post-footer"&#62;
                                     &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                       &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;29 Mar 2022&#60;/span&#62;&#60;/li&#62;
-                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                                     &#60;/ul&#62;
                                     &#60;!-- /.post-meta --&#62;
                                   &#60;/div&#62;
@@ -1079,17 +1079,17 @@
                                     &#60;/figcaption&#62;
                                   &#60;/figure&#62;
                                   &#60;div class="post-header"&#62;
-                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                       &#60;a href="#" class="hover" rel="category"&#62;Meeting&#60;/a&#62;
                                     &#60;/div&#62;
                                     &#60;!-- /.post-category --&#62;
-                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
+                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
                                   &#60;/div&#62;
                                   &#60;!-- /.post-header --&#62;
                                   &#60;div class="post-footer"&#62;
                                     &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                       &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;26 Feb 2022&#60;/span&#62;&#60;/li&#62;
-                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
+                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
                                     &#60;/ul&#62;
                                     &#60;!-- /.post-meta --&#62;
                                   &#60;/div&#62;
@@ -1106,16 +1106,16 @@
                                     &#60;/figcaption&#62;
                                   &#60;/figure&#62;
                                   &#60;div class="post-header"&#62;
-                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                    &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                       &#60;a href="#" class="hover" rel="category"&#62;Business Tips&#60;/a&#62;
                                     &#60;/div&#62;
                                     &#60;!-- /.post-category --&#62;
-                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
+                                    &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
                                   &#60;/div&#62;
                                   &#60;div class="post-footer"&#62;
                                     &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                       &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;7 Jan 2022&#60;/span&#62;&#60;/li&#62;
-                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
+                                      &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
                                     &#60;/ul&#62;
                                     &#60;!-- /.post-meta --&#62;
                                   &#60;/div&#62;
@@ -1153,14 +1153,14 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
-            <h2 class="!text-[.75rem] !leading-[1.35] uppercase !text-[#3f78e0]  !text-center">Our News</h2>
+            <h2 class="!text-[.75rem] !leading-[1.35] uppercase !text-[#e31e24]  !text-center">Our News</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6 !text-center">Here are the latest company news from our blog that got the most attention.</h3>
           </div>
           <!-- /column -->
         </div>
         <!-- /.row -->
         <div class="!relative">
-          <div class="shape bg-dot primary rellax !w-[7rem] !h-[10rem] !absolute z-[1] opacity-50 !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.7rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[7rem] !h-[10rem] !absolute z-[1] opacity-50 !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.7rem;"></div>
           <div class="swiper-container dots-closer blog grid-view !mb-6" data-margin="0" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1">
             <div class="swiper">
               <div class="swiper-wrapper">
@@ -1175,11 +1175,11 @@
                         </figure>
                         <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                           <div class="post-header">
-                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                               <a href="#" class="hover" rel="category">Coding</a>
                             </div>
                             <!-- /.post-category -->
-                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
+                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
                           </div>
                           <!-- /.post-header -->
                           <div class="!relative">
@@ -1191,8 +1191,8 @@
                         <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
-                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1216,11 +1216,11 @@
                         </figure>
                         <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                           <div class="post-header">
-                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                               <a href="#" class="hover" rel="category">Workspace</a>
                             </div>
                             <!-- /.post-category -->
-                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
+                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
                           </div>
                           <!-- /.post-header -->
                           <div class="!relative">
@@ -1232,8 +1232,8 @@
                         <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
-                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1257,11 +1257,11 @@
                         </figure>
                         <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                           <div class="post-header">
-                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                               <a href="#" class="hover" rel="category">Meeting</a>
                             </div>
                             <!-- /.post-category -->
-                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ultricies fusce porta elit</a></h2>
+                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ultricies fusce porta elit</a></h2>
                           </div>
                           <!-- /.post-header -->
                           <div class="!relative">
@@ -1273,8 +1273,8 @@
                         <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
-                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1298,11 +1298,11 @@
                         </figure>
                         <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                           <div class="post-header">
-                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                               <a href="#" class="hover" rel="category">Business Tips</a>
                             </div>
                             <!-- /.post-category -->
-                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Morbi leo risus porta eget</a></h2>
+                            <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Morbi leo risus porta eget</a></h2>
                           </div>
                           <div class="!relative">
                             <p>Mauris convallis non ligula non interdum. Gravida vulputate convallis tempus vestibulum cras imperdiet nun eu dolor. Aenean lacinia bibendum nulla sed.</p>
@@ -1313,8 +1313,8 @@
                         <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
-                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                            <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1350,14 +1350,14 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px]"&#62;
                       &#60;div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"&#62;
-                        &#60;h2 class="!text-[.75rem] !leading-[1.35] uppercase !text-[#3f78e0]  !text-center"&#62;Our News&#60;/h2&#62;
+                        &#60;h2 class="!text-[.75rem] !leading-[1.35] uppercase !text-[#e31e24]  !text-center"&#62;Our News&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6 !text-center"&#62;Here are the latest company news from our blog that got the most attention.&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
                     &#60;!-- /.row --&#62;
                     &#60;div class="!relative"&#62;
-                      &#60;div class="shape bg-dot primary rellax !w-[7rem] !h-[10rem] !absolute z-[1] opacity-50 !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.7rem;"&#62;&#60;/div&#62;
+                      &#60;div class="shape bg-dot primary rellax !w-[7rem] !h-[10rem] !absolute z-[1] opacity-50 !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.7rem;"&#62;&#60;/div&#62;
                       &#60;div class="swiper-container dots-closer blog grid-view !mb-6" data-margin="0" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1"&#62;
                         &#60;div class="swiper"&#62;
                           &#60;div class="swiper-wrapper"&#62;
@@ -1372,11 +1372,11 @@
                                     &#60;/figure&#62;
                                     &#60;div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  "&#62;
                                       &#60;div class="post-header"&#62;
-                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                           &#60;a href="#" class="hover" rel="category"&#62;Coding&#60;/a&#62;
                                         &#60;/div&#62;
                                         &#60;!-- /.post-category --&#62;
-                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
+                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
                                       &#60;/div&#62;
                                       &#60;!-- /.post-header --&#62;
                                       &#60;div class="!relative"&#62;
@@ -1388,8 +1388,8 @@
                                     &#60;div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]"&#62;
                                       &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                                         &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;14 Apr 2022&#60;/span&#62;&#60;/li&#62;
-                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
-                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;5&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;5&#60;/a&#62;&#60;/li&#62;
                                       &#60;/ul&#62;
                                       &#60;!-- /.post-meta --&#62;
                                     &#60;/div&#62;
@@ -1413,11 +1413,11 @@
                                     &#60;/figure&#62;
                                     &#60;div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  "&#62;
                                       &#60;div class="post-header"&#62;
-                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                           &#60;a href="#" class="hover" rel="category"&#62;Workspace&#60;/a&#62;
                                         &#60;/div&#62;
                                         &#60;!-- /.post-category --&#62;
-                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
+                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
                                       &#60;/div&#62;
                                       &#60;!-- /.post-header --&#62;
                                       &#60;div class="!relative"&#62;
@@ -1429,8 +1429,8 @@
                                     &#60;div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]"&#62;
                                       &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                                         &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;29 Mar 2022&#60;/span&#62;&#60;/li&#62;
-                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
-                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                                       &#60;/ul&#62;
                                       &#60;!-- /.post-meta --&#62;
                                     &#60;/div&#62;
@@ -1454,11 +1454,11 @@
                                     &#60;/figure&#62;
                                     &#60;div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  "&#62;
                                       &#60;div class="post-header"&#62;
-                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                           &#60;a href="#" class="hover" rel="category"&#62;Meeting&#60;/a&#62;
                                         &#60;/div&#62;
                                         &#60;!-- /.post-category --&#62;
-                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
+                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
                                       &#60;/div&#62;
                                       &#60;!-- /.post-header --&#62;
                                       &#60;div class="!relative"&#62;
@@ -1470,8 +1470,8 @@
                                     &#60;div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]"&#62;
                                       &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                                         &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;26 Feb 2022&#60;/span&#62;&#60;/li&#62;
-                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
-                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                                       &#60;/ul&#62;
                                       &#60;!-- /.post-meta --&#62;
                                     &#60;/div&#62;
@@ -1495,11 +1495,11 @@
                                     &#60;/figure&#62;
                                     &#60;div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  "&#62;
                                       &#60;div class="post-header"&#62;
-                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                        &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                           &#60;a href="#" class="hover" rel="category"&#62;Business Tips&#60;/a&#62;
                                         &#60;/div&#62;
                                         &#60;!-- /.post-category --&#62;
-                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
+                                        &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
                                       &#60;/div&#62;
                                       &#60;div class="!relative"&#62;
                                         &#60;p&#62;Mauris convallis non ligula non interdum. Gravida vulputate convallis tempus vestibulum cras imperdiet nun eu dolor. Aenean lacinia bibendum nulla sed.&#60;/p&#62;
@@ -1510,8 +1510,8 @@
                                     &#60;div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]"&#62;
                                       &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                                         &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;7 Jan 2022&#60;/span&#62;&#60;/li&#62;
-                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
-                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;5&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
+                                        &#60;li class="post-likes !ml-auto inline-block"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"&#62;&#60;/i&#62;5&#60;/a&#62;&#60;/li&#62;
                                       &#60;/ul&#62;
                                       &#60;!-- /.post-meta --&#62;
                                     &#60;/div&#62;
@@ -1578,15 +1578,15 @@
               </div>
               <!-- /.post-slider -->
               <div class="post-header !mb-5">
-                <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                   <a href="#" class="hover" rel="category">Ideas</a>
                 </div>
                 <!-- /.post-category -->
-                <h2 class="post-title !mt-1 !mb-4"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
+                <h2 class="post-title !mt-1 !mb-4"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
                 <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                   <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>5 Jul 2022</span></li>
-                  <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                  <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
+                  <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                  <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
                 </ul>
                 <!-- /.post-meta -->
               </div>
@@ -1609,17 +1609,17 @@
                 </figcaption>
               </figure>
                   <div class="post-header">
-                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                       <a href="#" class="hover" rel="category">Coding</a>
                     </div>
                     <!-- /.post-category -->
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Ligula tristique quis risus</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="post-footer">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -1636,17 +1636,17 @@
                 </figcaption>
               </figure>
                   <div class="post-header">
-                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                    <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                       <a href="#" class="hover" rel="category">Workspace</a>
                     </div>
                     <!-- /.post-category -->
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html">Nullam id dolor elit id nibh</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="post-footer">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -1703,15 +1703,15 @@
                           &#60;/div&#62;
                           &#60;!-- /.post-slider --&#62;
                           &#60;div class="post-header !mb-5"&#62;
-                            &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                            &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                               &#60;a href="#" class="hover" rel="category"&#62;Ideas&#60;/a&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-category --&#62;
-                            &#60;h2 class="post-title !mt-1 !mb-4"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Fringilla Ligula Pharetra Amet&#60;/a&#62;&#60;/h2&#62;
+                            &#60;h2 class="post-title !mt-1 !mb-4"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Fringilla Ligula Pharetra Amet&#60;/a&#62;&#60;/h2&#62;
                             &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                               &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;5 Jul 2022&#60;/span&#62;&#60;/li&#62;
-                              &#60;li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"&#62;&#60;/i&#62;&#60;span&#62;By Trunçgil&#60;/span&#62;&#60;/a&#62;&#60;/li&#62;
-                              &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;span&#62; Comments&#60;/span&#62;&#60;/a&#62;&#60;/li&#62;
+                              &#60;li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"&#62;&#60;/i&#62;&#60;span&#62;By Trunçgil&#60;/span&#62;&#60;/a&#62;&#60;/li&#62;
+                              &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;span&#62; Comments&#60;/span&#62;&#60;/a&#62;&#60;/li&#62;
                             &#60;/ul&#62;
                             &#60;!-- /.post-meta --&#62;
                           &#60;/div&#62;
@@ -1734,17 +1734,17 @@
                             &#60;/figcaption&#62;
                           &#60;/figure&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                   &#60;a href="#" class="hover" rel="category"&#62;Coding&#60;/a&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /.post-category --&#62;
-                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
                               &#60;div class="post-footer"&#62;
                                 &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                   &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;14 Apr 2022&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
+                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
                                 &#60;!-- /.post-meta --&#62;
                               &#60;/div&#62;
@@ -1761,17 +1761,17 @@
                             &#60;/figcaption&#62;
                           &#60;/figure&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]"&#62;
+                                &#60;div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]"&#62;
                                   &#60;a href="#" class="hover" rel="category"&#62;Workspace&#60;/a&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /.post-category --&#62;
-                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
                               &#60;div class="post-footer"&#62;
                                 &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0"&#62;
                                   &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;29 Mar 2022&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                                  &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
                                 &#60;!-- /.post-meta --&#62;
                               &#60;/div&#62;
@@ -1806,7 +1806,7 @@
         <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
           <div class="flex flex-wrap mx-[-15px]">
             <div class="xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-              <i class="icn-flower !text-[#3f78e0]  xl:!text-[1.5rem] !text-[calc(1.275rem_+_0.3vw)] opacity-25"></i>
+              <i class="icn-flower !text-[#e31e24]  xl:!text-[1.5rem] !text-[calc(1.275rem_+_0.3vw)] opacity-25"></i>
               <h2 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !text-center !mt-2 !mb-10">Here are the latest posts from my blog that grabbed the most attention.</h2>
             </div>
             <!--/column -->
@@ -1829,13 +1829,13 @@
                             <a href="#" class="hover" rel="category">Wedding</a>
                           </div>
                           <!-- /.post-category -->
-                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Ligula tristique quis risus</a></h2>
+                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Ligula tristique quis risus</a></h2>
                         </div>
                         <!-- /.post-header -->
                         <div class="post-footer">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1862,13 +1862,13 @@
                             <a href="#" class="hover" rel="category">Engagement</a>
                           </div>
                           <!-- /.post-category -->
-                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                         </div>
                         <!-- /.post-header -->
                         <div class="post-footer">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1895,13 +1895,13 @@
                             <a href="#" class="hover" rel="category">Couples</a>
                           </div>
                           <!-- /.post-category -->
-                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Ultricies fusce porta elit</a></h2>
+                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Ultricies fusce porta elit</a></h2>
                         </div>
                         <!-- /.post-header -->
                         <div class="post-footer">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1928,13 +1928,13 @@
                             <a href="#" class="hover" rel="category">Engagement</a>
                           </div>
                           <!-- /.post-category -->
-                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Morbi leo risus porta eget</a></h2>
+                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Morbi leo risus porta eget</a></h2>
                         </div>
                         <!-- /.post-header -->
                         <div class="post-footer">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>17 Jan 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1961,13 +1961,13 @@
                             <a href="#" class="hover" rel="category">Couples</a>
                           </div>
                           <!-- /.post-category -->
-                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Nulla vitae elit libero</a></h2>
+                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Nulla vitae elit libero</a></h2>
                         </div>
                         <!-- /.post-header -->
                         <div class="post-footer">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>1</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>1</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -1994,13 +1994,13 @@
                             <a href="#" class="hover" rel="category">Wedding</a>
                           </div>
                           <!-- /.post-category -->
-                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../blog-post.html'>Pharetra augue elit sem</a></h2>
+                          <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../blog-post.html'>Pharetra augue elit sem</a></h2>
                         </div>
                         <!-- /.post-header -->
                         <div class="post-footer">
                           <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                             <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>2 Jan 2022</span></li>
-                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                            <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
                           </ul>
                           <!-- /.post-meta -->
                         </div>
@@ -2038,7 +2038,7 @@
   &#60;div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24"&#62;
   &#60;div class="flex flex-wrap mx-[-15px]"&#62;
     &#60;div class="xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center"&#62;
-      &#60;i class="icn-flower !text-[#3f78e0]  xl:!text-[1.5rem] !text-[calc(1.275rem_+_0.3vw)] opacity-25"&#62;&#60;/i&#62;
+      &#60;i class="icn-flower !text-[#e31e24]  xl:!text-[1.5rem] !text-[calc(1.275rem_+_0.3vw)] opacity-25"&#62;&#60;/i&#62;
       &#60;h2 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !text-center !mt-2 !mb-10"&#62;Here are the latest posts from my blog that grabbed the most attention.&#60;/h2&#62;
     &#60;/div&#62;
     &#60;!--/column --&#62;
@@ -2061,13 +2061,13 @@
                     &#60;a href="#" class="hover" rel="category"&#62;Wedding&#60;/a&#62;
                   &#60;/div&#62;
                   &#60;!-- /.post-category --&#62;
-                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
+                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Ligula tristique quis risus&#60;/a&#62;&#60;/h2&#62;
                 &#60;/div&#62;
                 &#60;!-- /.post-header --&#62;
                 &#60;div class="post-footer"&#62;
                   &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;14 Apr 2022&#60;/span&#62;&#60;/li&#62;
-                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;4&#60;/a&#62;&#60;/li&#62;
                   &#60;/ul&#62;
                   &#60;!-- /.post-meta --&#62;
                 &#60;/div&#62;
@@ -2094,13 +2094,13 @@
                     &#60;a href="#" class="hover" rel="category"&#62;Engagement&#60;/a&#62;
                   &#60;/div&#62;
                   &#60;!-- /.post-category --&#62;
-                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
+                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Nullam id dolor elit id nibh&#60;/a&#62;&#60;/h2&#62;
                 &#60;/div&#62;
                 &#60;!-- /.post-header --&#62;
                 &#60;div class="post-footer"&#62;
                   &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;29 Mar 2022&#60;/span&#62;&#60;/li&#62;
-                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                   &#60;/ul&#62;
                   &#60;!-- /.post-meta --&#62;
                 &#60;/div&#62;
@@ -2127,13 +2127,13 @@
                     &#60;a href="#" class="hover" rel="category"&#62;Couples&#60;/a&#62;
                   &#60;/div&#62;
                   &#60;!-- /.post-category --&#62;
-                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
+                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Ultricies fusce porta elit&#60;/a&#62;&#60;/h2&#62;
                 &#60;/div&#62;
                 &#60;!-- /.post-header --&#62;
                 &#60;div class="post-footer"&#62;
                   &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;26 Feb 2022&#60;/span&#62;&#60;/li&#62;
-                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;6&#60;/a&#62;&#60;/li&#62;
                   &#60;/ul&#62;
                   &#60;!-- /.post-meta --&#62;
                 &#60;/div&#62;
@@ -2160,13 +2160,13 @@
                     &#60;a href="#" class="hover" rel="category"&#62;Engagement&#60;/a&#62;
                   &#60;/div&#62;
                   &#60;!-- /.post-category --&#62;
-                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
+                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Morbi leo risus porta eget&#60;/a&#62;&#60;/h2&#62;
                 &#60;/div&#62;
                 &#60;!-- /.post-header --&#62;
                 &#60;div class="post-footer"&#62;
                   &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;17 Jan 2022&#60;/span&#62;&#60;/li&#62;
-                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;3&#60;/a&#62;&#60;/li&#62;
                   &#60;/ul&#62;
                   &#60;!-- /.post-meta --&#62;
                 &#60;/div&#62;
@@ -2193,13 +2193,13 @@
                     &#60;a href="#" class="hover" rel="category"&#62;Couples&#60;/a&#62;
                   &#60;/div&#62;
                   &#60;!-- /.post-category --&#62;
-                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Nulla vitae elit libero&#60;/a&#62;&#60;/h2&#62;
+                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Nulla vitae elit libero&#60;/a&#62;&#60;/h2&#62;
                 &#60;/div&#62;
                 &#60;!-- /.post-header --&#62;
                 &#60;div class="post-footer"&#62;
                   &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;7 Jan 2022&#60;/span&#62;&#60;/li&#62;
-                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;1&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;1&#60;/a&#62;&#60;/li&#62;
                   &#60;/ul&#62;
                   &#60;!-- /.post-meta --&#62;
                 &#60;/div&#62;
@@ -2226,13 +2226,13 @@
                     &#60;a href="#" class="hover" rel="category"&#62;Wedding&#60;/a&#62;
                   &#60;/div&#62;
                   &#60;!-- /.post-category --&#62;
-                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Pharetra augue elit sem&#60;/a&#62;&#60;/h2&#62;
+                  &#60;h2 class="post-title h3 !mt-1 !mb-3"&#62;&#60;a class="!text-[#343f52] hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Pharetra augue elit sem&#60;/a&#62;&#60;/h2&#62;
                 &#60;/div&#62;
                 &#60;!-- /.post-header --&#62;
                 &#60;div class="post-footer"&#62;
                   &#60;ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0"&#62;
                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;2 Jan 2022&#60;/span&#62;&#60;/li&#62;
-                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"&#62;&#60;a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"&#62;&#60;i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"&#62;&#60;/i&#62;2&#60;/a&#62;&#60;/li&#62;
                   &#60;/ul&#62;
                   &#60;!-- /.post-meta --&#62;
                 &#60;/div&#62;
@@ -2285,9 +2285,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/call-to-action.html b/public/docs/blocks/call-to-action.html
index ee61fe7..eaa146f 100644
--- a/public/docs/blocks/call-to-action.html
+++ b/public/docs/blocks/call-to-action.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -577,7 +577,7 @@
         <ul class="pl-0 list-none  !mb-0">
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='about.html'>About</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded' href='blog.html'>Blog</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0] pointer-events-none' href='call-to-action.html'>Call to Action</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24] pointer-events-none' href='call-to-action.html'>Call to Action</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='clients.html'>Clients</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='contact.html'>Contact</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='facts.html'>Facts</a></li>
@@ -603,7 +603,7 @@
           <div class="lg:w-6/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3 !text-center">Join Our Community</h2>
             <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-5 xl:!px-3 lg:!px-3 md:!px-24">We are trusted by over 5000+ clients. Join them by using our services and grow your business.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
           </div>
           <!-- /column -->
         </div>
@@ -628,7 +628,7 @@
       &lt;div class=&quot;lg:w-6/12 flex-[0_0_auto] !px-[15px] max-w-full xl:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto&quot;&gt;
         &lt;h2 class=&quot;text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3 !text-center&quot;&gt;Join Our Community&lt;/h2&gt;
         &lt;p class=&quot;lead !mb-5 md:!px-24 lg:!px-3&quot;&gt;We are trusted by over 5000+ clients. Join them by using our services and grow your business.&lt;/p&gt;
-        &lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;&gt;Join Us&lt;/a&gt;
+        &lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;&gt;Join Us&lt;/a&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
     &lt;/div&gt;
@@ -714,7 +714,7 @@
             <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/puzzle-2.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !mb-4 m-[0_auto]"><path class="lineal-fill" d="M257.9 15.2v65.1c-28.7-15.6-64.7-5-80.3 23.8s-5 64.7 23.8 80.3c17.6 9.6 38.9 9.6 56.6 0v65.1h59.9c-8.4-31.6 10.5-64 42.1-72.4 31.6-8.4 64 10.5 72.4 42.1 2.6 9.9 2.6 20.4 0 30.3h59.9V70.7c0-30.7-24.9-55.5-55.5-55.5H257.9z"></path><path class="lineal-stroke" d="M436.7 0h-366C31.7 0 0 31.7 0 70.7v370.6c0 39 31.7 70.7 70.7 70.7h188.1c8.4 0 15.2-6.8 15.2-15.1V453c5.5 1 11.2 1.3 16.8 1 17.5-.9 34.2-7.9 47.1-19.9 30.1-28 31.7-75.1 3.7-105.2-23.2-24.8-60.2-30.8-90-14.6-7.3 4-10.1 13.2-6.1 20.6 4 7.4 13.2 10.1 20.6 6.1 7.4-4 15.7-5.8 24.1-5.2 24.3 1.7 42.6 22.8 40.9 47-1.5 21.8-19.8 39.8-41.7 40.8-8.1.4-16.1-1.4-23.2-5.3-2.2-1.2-4.7-1.8-7.3-1.8-8.4 0-15.2 6.8-15.2 15.2v49.9h-173c-22.3 0-40.3-18.1-40.3-40.3V264.6h28.7c-.5 2.6-.8 5.2-1 7.8-2.9 41 28 76.6 69 79.5 1.8.1 3.6.2 5.3.2 18.8.1 37-7.1 50.7-20 24.8-23.2 30.8-60.1 14.6-89.9-.1-.2-.2-.3-.3-.5-4.1-7.3-13.4-9.9-20.7-5.7-7.3 4.1-9.9 13.4-5.7 20.7 4 7.4 5.8 15.8 5.2 24.2-1.7 24.3-22.8 42.5-47.1 40.8-21.8-1.5-39.8-19.8-40.8-41.7-.4-8.1 1.4-16.1 5.2-23.3 1.2-2.2 1.9-4.7 1.9-7.3 0-8.4-6.8-15.2-15.2-15.2H30.4V70.7c0-22.3 18.1-40.3 40.3-40.3h172v28.7c-8.7-1.6-17.6-1.6-26.2 0-40.5 7.2-67.4 45.9-60.1 86.4s45.9 67.4 86.4 60.1v43.9c0 8.4 6.8 15.2 15.2 15.2h59.9c1.6 0 3.2-.3 4.7-.7 8-2.6 12.3-11.2 9.7-19.2-.6-2.5-1-5.1-1.2-7.7-1.5-24.3 16.9-45.2 41.2-46.7.9-.1 1.8-.1 2.7-.1 3.8 0 7.6.5 11.3 1.5 23.5 6.2 37.5 30.4 31.3 53.9-.3 1.3-.5 2.6-.5 3.9 0 8.4 6.8 15.2 15.2 15.2h59.9c8.4 0 15.2-6.8 15.2-15.2V70.7c-.1-39-31.7-70.7-70.7-70.7zM477 234.2h-27.5c0-41.1-33.3-74.4-74.4-74.4-1.5 0-3 0-4.6.1-36 2.2-65.9 30.9-69.5 66.8-.2 2.5-.4 5-.4 7.5h-27.5v-49.9c0-2.5-.6-5-1.8-7.3-4-7.4-13.2-10.1-20.6-6.1-7.4 4-15.7 5.8-24.1 5.2-24.3-1.7-42.6-22.8-40.9-47 1.5-21.8 19.8-39.8 41.7-40.8 8.1-.4 16.1 1.4 23.2 5.3 2.2 1.2 4.7 1.8 7.3 1.8 8.4 0 15.2-6.8 15.2-15.2V30.4h163.6c22.3 0 40.3 18.1 40.3 40.3v163.5z"></path></svg>
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Join Our Community</h2>
             <p class="lead text-[1rem] !mb-6 xl:!px-10 xxl:!px-20">We are trusted by over 5000+ clients. Join them by using our services and grow your business.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
           </div>
           <!-- /column -->
         </div>
@@ -737,7 +737,7 @@
                         &#60;img src="../../assets/img/icons/lineal/puzzle-2.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !mb-4 m-[0_auto]" alt="image"&#62;
                         &#60;h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3"&#62;Join Our Community&#60;/h2&#62;
                         &#60;p class="lead text-[1rem] !mb-6 xl:!px-10 xxl:!px-20"&#62;We are trusted by over 5000+ clients. Join them by using our services and grow your business.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Join Us&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Join Us&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
@@ -826,7 +826,7 @@
         <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
           <div class="flex flex-wrap mx-[-15px] !mb-8">
             <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-              <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]">Analyze Now</h2>
+              <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]">Analyze Now</h2>
               <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3]  !mb-0">Wonder how much faster your website can go? Easily check your SEO Score now.</h3>
             </div>
             <!-- /column -->
@@ -838,7 +838,7 @@
                 <div class="form-floating input-group relative">
                   <input type="url" class="form-control border-0 relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] duration-[0.15s] ease-in-out   focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="analyze">
                   <label class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope" for="analyze">Enter Website URL</label>
-                  <button class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button">Analyze</button>
+                  <button class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button">Analyze</button>
                 </div>
               </form>
             </div>
@@ -861,7 +861,7 @@
                   &#60;div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] !mb-8"&#62;
                       &#60;div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center"&#62;
-                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]"&#62;Analyze Now&#60;/h2&#62;
+                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]"&#62;Analyze Now&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3]  !mb-0"&#62;Wonder how much faster your website can go? Easily check your SEO Score now.&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
@@ -873,7 +873,7 @@
                           &#60;div class="form-floating input-group relative"&#62;
                             &#60;input type="url" class="form-control border-0 relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] duration-[0.15s] ease-in-out   focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]     placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="Enter Website URL" id="analyze"&#62;
                             &#60;label class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope" for="analyze"&#62;Enter Website URL&#60;/label&#62;
-                            &#60;button class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button"&#62;Analyze&#60;/button&#62;
+                            &#60;button class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button"&#62;Analyze&#60;/button&#62;
                           &#60;/div&#62;
                         &#60;/form&#62;
                       &#60;/div&#62;
@@ -903,7 +903,7 @@
             <h1 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-4 md:!px-10 lg:!px-0">Get all of your steps, exercise, sleep and meds in one place.</h1>
             <p class="lead text-[1.05rem] !leading-[1.6] !mb-7 md:!px-10 lg:!px-0 xl:!px-0 xxl:!pr-20">Trunçgil is now available to download from both the App Store and Google Play Store.</p>
             <div class="flex justify-center xl:!justify-start lg:!justify-start">
-              <span><a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !mr-2"><i class="uil uil-apple !mr-[.3rem] before:content-['\e938']"></i> App Store</a></span>
+              <span><a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !mr-2"><i class="uil uil-apple !mr-[.3rem] before:content-['\e938']"></i> App Store</a></span>
               <span><a class="btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  btn-icon btn-icon-start rounded"><i class="uil uil-google-play !mr-[.3rem] before:content-['\eb4f']"></i> Google Play</a></span>
             </div>
           </div>
@@ -929,7 +929,7 @@
                         &#60;h1 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-4 md:!px-10 lg:!px-0"&#62;Get all of your steps, exercise, sleep and meds in one place.&#60;/h1&#62;
                         &#60;p class="lead text-[1.05rem] !leading-[1.6] !mb-7 md:!px-10 lg:!px-0 xl:!px-0 xxl:!pr-20"&#62;Trunçgil is now available to download from both the App Store and Google Play Store.&#60;/p&#62;
                         &#60;div class="flex justify-center xl:!justify-start lg:!justify-start"&#62;
-                          &#60;span&#62;&#60;a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !mr-2"&#62;&#60;i class="uil uil-apple !mr-[.3rem] before:content-['\e938']"&#62;&#60;/i&#62; App Store&#60;/a&#62;&#60;/span&#62;
+                          &#60;span&#62;&#60;a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !mr-2"&#62;&#60;i class="uil uil-apple !mr-[.3rem] before:content-['\e938']"&#62;&#60;/i&#62; App Store&#60;/a&#62;&#60;/span&#62;
                           &#60;span&#62;&#60;a class="btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  btn-icon btn-icon-start rounded"&#62;&#60;i class="uil uil-google-play !mr-[.3rem] before:content-['\eb4f']"&#62;&#60;/i&#62; Google Play&#60;/a&#62;&#60;/span&#62;
                         &#60;/div&#62;
                       &#60;/div&#62;
@@ -1051,7 +1051,7 @@
             <div class="flex flex-wrap mx-[-15px]">
               <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
                 <h2 class="!text-[0.8rem] !leading-[1.35] uppercase !text-white !mb-3">Join Our Community</h2>
-                <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !text-white !mb-6">We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"><em>trusted</em></span> by over 5000+ clients. Join them now and grow your business.</h3>
+                <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !text-white !mb-6">We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"><em>trusted</em></span> by over 5000+ clients. Join them now and grow your business.</h3>
                 <a href="#" class="btn btn-white">Join Us</a>
               </div>
               <!-- /column -->
@@ -1078,7 +1078,7 @@
                       &#60;div class="flex flex-wrap mx-[-15px]"&#62;
                         &#60;div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center"&#62;
                           &#60;h2 class="!text-[0.8rem] !leading-[1.35] uppercase !text-white !mb-3"&#62;Join Our Community&#60;/h2&#62;
-                          &#60;h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !text-white !mb-6"&#62;We are &#60;span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"&#62;&#60;em&#62;trusted&#60;/em&#62;&#60;/span&#62; by over 5000+ clients. Join them now and grow your business.&#60;/h3&#62;
+                          &#60;h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !text-white !mb-6"&#62;We are &#60;span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"&#62;&#60;em&#62;trusted&#60;/em&#62;&#60;/span&#62; by over 5000+ clients. Join them now and grow your business.&#60;/h3&#62;
                           &#60;a href="#" class="btn btn-white"&#62;Join Us&#60;/a&#62;
                         &#60;/div&#62;
                         &#60;!-- /column --&#62;
@@ -1112,7 +1112,7 @@
                 <div class="lg:w-9/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
                   <h2 class="font-bold !leading-[1.2] xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] lg:mx-[-2.5rem] xl:mx-0 !mb-5">Got a 👾 project in mind? Let's work together. ✌️</h2>
                   <p class="lead !text-[1.2rem] !leading-[1.65] md:!px-14 lg:!px-0 lg:mx-[-2.5rem] xl:mx-0 !mb-8">I bring rapid solutions to make the life of my clients easier. Have any questions? Reach out to me and I will get back to you shortly.</p>
-                  <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end">Contact Me <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
+                  <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end">Contact Me <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
                 </div>
                 <!-- /column -->
               </div>
@@ -1146,7 +1146,7 @@
                           &#60;div class="lg:w-9/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"&#62;
                             &#60;h2 class="font-bold !leading-[1.2] xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] lg:mx-[-2.5rem] xl:mx-0 !mb-5"&#62;Got a 👾 project in mind? Let's work together. &#9996;️&#60;/h2&#62;
                             &#60;p class="lead !text-[1.2rem] !leading-[1.65] md:!px-14 lg:!px-0 lg:mx-[-2.5rem] xl:mx-0 !mb-8"&#62;I bring rapid solutions to make the life of my clients easier. Have any questions? Reach out to me and I will get back to you shortly.&#60;/p&#62;
-                            &#60;a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end"&#62;Contact Me &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
+                            &#60;a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end"&#62;Contact Me &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
                           &#60;/div&#62;
                           &#60;!-- /column --&#62;
                         &#60;/div&#62;
@@ -1186,9 +1186,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/clients.html b/public/docs/blocks/clients.html
index 24cb394..a2e5b7e 100644
--- a/public/docs/blocks/clients.html
+++ b/public/docs/blocks/clients.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,7 +578,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='about.html'>About</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='blog.html'>Blog</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='call-to-action.html'>Call to Action</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='clients.html'>Clients</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='clients.html'>Clients</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='contact.html'>Contact</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='facts.html'>Facts</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='faq.html'>FAQ</a></li>
@@ -971,9 +971,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/contact.html b/public/docs/blocks/contact.html
index 46924fa..0e84f0a 100644
--- a/public/docs/blocks/contact.html
+++ b/public/docs/blocks/contact.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -579,7 +579,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='blog.html'>Blog</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='call-to-action.html'>Call to Action</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='clients.html'>Clients</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='contact.html'>Contact</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='contact.html'>Contact</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='facts.html'>Facts</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='faq.html'>FAQ</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='features.html'>Features</a></li>
@@ -659,7 +659,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-50px] items-center">
           <div class="md:w-8/12 lg:w-6/12 xl:w-5/12 lg:!ml-0 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"></div>
+            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem] w-full max-w-full !h-auto" src="../../assets/img/photos/about4.jpg" alt="image"></figure>
           </div>
           <!--/column -->
@@ -668,7 +668,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-8">Convinced yet? Let's make something great together.</h2>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Address</h5>
@@ -677,7 +677,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Phone</h5>
@@ -686,7 +686,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">E-mail</h5>
@@ -712,7 +712,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-50px] items-center"&#62;
                       &#60;div class="md:w-8/12 lg:w-6/12 xl:w-5/12 lg:!ml-0 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative"&#62;
-                        &#60;div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"&#62;&#60;/div&#62;
+                        &#60;div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"&#62;&#60;/div&#62;
                         &#60;figure class="!rounded-[.4rem] relative z-[2]"&#62;&#60;img class="!rounded-[.4rem] w-full max-w-full !h-auto" src="../../assets/img/photos/about4.jpg" alt="image"&#62;&#60;/figure&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
@@ -721,7 +721,7 @@
                         &#60;h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-8"&#62;Convinced yet? Let's make something great together.&#60;/h2&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h5 class="!mb-1"&#62;Address&#60;/h5&#62;
@@ -730,7 +730,7 @@
                         &#60;/div&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h5 class="!mb-1"&#62;Phone&#60;/h5&#62;
@@ -739,7 +739,7 @@
                         &#60;/div&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h5 class="!mb-1"&#62;E-mail&#60;/h5&#62;
@@ -769,7 +769,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] items-center">
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
+            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
                 <figure class="!rounded-[.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[.4rem]" src="../../assets/img/photos/g5.jpg" alt="image"></figure>
@@ -804,7 +804,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">trusted by</span> over 5000+ clients. Join them by using our services and grow your business.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
           </div>
           <!--/column -->
         </div>
@@ -824,7 +824,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] items-center"&#62;
                       &#60;div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative"&#62;
-                        &#60;div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"&#62;&#60;/div&#62;
+                        &#60;div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"&#62;&#60;/div&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]"&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full"&#62;
                             &#60;figure class="!rounded-[.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/g5.jpg" alt="image"&#62;&#60;/figure&#62;
@@ -859,7 +859,7 @@
                         &#60;h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3"&#62;Let&#8217;s Talk&#60;/h2&#62;
                         &#60;p class="lead !text-[1.05rem] !leading-[1.6] font-medium"&#62;Let's make something great together. We are &#60;span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]"&#62;trusted by&#60;/span&#62; over 5000+ clients. Join them by using our services and grow your business.&#60;/p&#62;
                         &#60;p&#62;Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Join Us&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Join Us&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
@@ -887,11 +887,11 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Get In Touch</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Get In Touch</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">Got any questions? Don't hesitate to get in touch.</h3>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Address</h5>
@@ -900,7 +900,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Phone</h5>
@@ -909,7 +909,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">E-mail</h5>
@@ -939,11 +939,11 @@
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full"&#62;
-                        &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3"&#62;Get In Touch&#60;/h2&#62;
+                        &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3"&#62;Get In Touch&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7"&#62;Got any questions? Don't hesitate to get in touch.&#60;/h3&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h5 class="!mb-1"&#62;Address&#60;/h5&#62;
@@ -952,7 +952,7 @@
                         &#60;/div&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h5 class="!mb-1"&#62;Phone&#60;/h5&#62;
@@ -961,7 +961,7 @@
                         &#60;/div&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h5 class="!mb-1"&#62;E-mail&#60;/h5&#62;
@@ -1054,7 +1054,7 @@
                     </div>
                     <!-- /column -->
                     <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full">
-                      <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
+                      <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
                       <p class="!text-[#aab0bc]"><strong>*</strong> These fields are required.</p>
                     </div>
                     <!-- /column -->
@@ -1067,7 +1067,7 @@
               <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
                 <div class="flex flex-row">
                   <div>
-                    <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                    <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                   </div>
                   <div>
                     <h5 class="!mb-1">Address</h5>
@@ -1076,7 +1076,7 @@
                 </div>
                 <div class="flex flex-row">
                   <div>
-                    <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                    <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                   </div>
                   <div>
                     <h5 class="!mb-1">Phone</h5>
@@ -1085,7 +1085,7 @@
                 </div>
                 <div class="flex flex-row">
                   <div>
-                    <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                    <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
                   </div>
                   <div>
                     <h5 class="!mb-1">E-mail</h5>
@@ -1179,7 +1179,7 @@
                                 &#60;/div&#62;
                                 &#60;!-- /column --&#62;
                                 &#60;div class="w-full flex-[0_0_auto] !px-[15px] max-w-full"&#62;
-                                  &#60;input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message"&#62;
+                                  &#60;input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message"&#62;
                                   &#60;p class="!text-[#aab0bc]"&#62;&#60;strong&#62;*&#60;/strong&#62; These fields are required.&#60;/p&#62;
                                 &#60;/div&#62;
                                 &#60;!-- /column --&#62;
@@ -1192,7 +1192,7 @@
                           &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h5 class="!mb-1"&#62;Address&#60;/h5&#62;
@@ -1201,7 +1201,7 @@
                             &#60;/div&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h5 class="!mb-1"&#62;Phone&#60;/h5&#62;
@@ -1210,7 +1210,7 @@
                             &#60;/div&#62;
                             &#60;div class="flex flex-row"&#62;
                               &#60;div&#62;
-                                &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
                               &#60;/div&#62;
                               &#60;div&#62;
                                 &#60;h5 class="!mb-1"&#62;E-mail&#60;/h5&#62;
@@ -1258,7 +1258,7 @@
                   <div class="p-10 xl:!p-[4.5rem] lg:!p-[4.5rem] md:!p-12">
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                       </div>
                       <div class="!self-start !justify-start">
                         <h5 class="!mb-1">Address</h5>
@@ -1268,7 +1268,7 @@
                     <!--/div -->
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                       </div>
                       <div>
                         <h5 class="!mb-1">Phone</h5>
@@ -1278,7 +1278,7 @@
                     <!--/div -->
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
                       </div>
                       <div>
                         <h5 class="!mb-1">E-mail</h5>
@@ -1327,7 +1327,7 @@
                               &#60;div class="p-10 xl:!p-[4.5rem] lg:!p-[4.5rem] md:!p-12"&#62;
                                 &#60;div class="flex flex-row"&#62;
                                   &#60;div&#62;
-                                    &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                    &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
                                   &#60;/div&#62;
                                   &#60;div class="!self-start !justify-start"&#62;
                                     &#60;h5 class="!mb-1"&#62;Address&#60;/h5&#62;
@@ -1337,7 +1337,7 @@
                                 &#60;!--/div --&#62;
                                 &#60;div class="flex flex-row"&#62;
                                   &#60;div&#62;
-                                    &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                    &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
                                   &#60;/div&#62;
                                   &#60;div&#62;
                                     &#60;h5 class="!mb-1"&#62;Phone&#60;/h5&#62;
@@ -1347,7 +1347,7 @@
                                 &#60;!--/div --&#62;
                                 &#60;div class="flex flex-row"&#62;
                                   &#60;div&#62;
-                                    &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                    &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-envelope before:content-['\eac8']"&#62;&#60;/i&#62; &#60;/div&#62;
                                   &#60;/div&#62;
                                   &#60;div&#62;
                                     &#60;h5 class="!mb-1"&#62;E-mail&#60;/h5&#62;
@@ -1404,7 +1404,7 @@
                     <div class="!text-left input-group !relative form-floating">
                       <input type="email" value="" name="EMAIL" class="required email form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL2">
                       <label for="mce-EMAIL2" class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1454,7 +1454,7 @@
                                 &#60;div class="!text-left input-group !relative form-floating"&#62;
                                   &#60;input type="email" value="" name="EMAIL" class="required email form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL2"&#62;
                                   &#60;label for="mce-EMAIL2" class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope"&#62;Email Address&#60;/label&#62;
-                                  &#60;input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]"&#62;
+                                  &#60;input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]"&#62;
                                 &#60;/div&#62;
                                 &#60;div id="mce-responses2" class="clear"&#62;
                                   &#60;div class="response" id="mce-error-response2" style="display:none"&#62;&#60;/div&#62;
@@ -1499,7 +1499,7 @@
                 <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
                 <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are trusted by over 5000+ clients. Join them by using our services and grow your business.</p>
                 <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
               </div>
               <!--/div -->
             </div>
@@ -1531,7 +1531,7 @@
                             &#60;h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3"&#62;Let&#8217;s Talk&#60;/h2&#62;
                             &#60;p class="lead !text-[1.05rem] !leading-[1.6] font-medium"&#62;Let's make something great together. We are trusted by over 5000+ clients. Join them by using our services and grow your business.&#60;/p&#62;
                             &#60;p&#62;Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.&#60;/p&#62;
-                            &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Join Us&#60;/a&#62;
+                            &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Join Us&#60;/a&#62;
                           &#60;/div&#62;
                           &#60;!--/div --&#62;
                         &#60;/div&#62;
@@ -1726,7 +1726,7 @@
                 <div class="valid-feedback"> Looks good! </div>
                 <div class="invalid-feedback"> Please enter your messsage. </div>
               </div>
-              <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
+              <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
               <p class="!text-[#aab0bc]"><strong>*</strong> These fields are required.</p>
             </form>
             <!-- /form -->
@@ -1776,7 +1776,7 @@
                             &#60;div class="valid-feedback"&#62; Looks good! &#60;/div&#62;
                             &#60;div class="invalid-feedback"&#62; Please enter your messsage. &#60;/div&#62;
                           &#60;/div&#62;
-                          &#60;input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message"&#62;
+                          &#60;input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message"&#62;
                           &#60;p class="!text-[#aab0bc]"&#62;&#60;strong&#62;*&#60;/strong&#62; These fields are required.&#60;/p&#62;
                         &#60;/form&#62;
                         &#60;!-- /form --&#62;
@@ -1839,7 +1839,7 @@
                       </div>
                       <!-- /column -->
                       <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center">
-                        <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send" value="Send message">
+                        <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send" value="Send message">
                       </div>
                       <!-- /column -->
                     </div>
@@ -1907,7 +1907,7 @@
                                   &#60;/div&#62;
                                   &#60;!-- /column --&#62;
                                   &#60;div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center"&#62;
-                                    &#60;input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send" value="Send message"&#62;
+                                    &#60;input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send" value="Send message"&#62;
                                   &#60;/div&#62;
                                   &#60;!-- /column --&#62;
                                 &#60;/div&#62;
@@ -1957,9 +1957,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/facts.html b/public/docs/blocks/facts.html
index 6474b9f..a06a017 100644
--- a/public/docs/blocks/facts.html
+++ b/public/docs/blocks/facts.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -580,7 +580,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='call-to-action.html'>Call to Action</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='clients.html'>Clients</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='contact.html'>Contact</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='facts.html'>Facts</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='facts.html'>Facts</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='faq.html'>FAQ</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='features.html'>Features</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='footer.html'>Footer</a></li>
@@ -805,26 +805,26 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3">Company Facts</h2>
+            <h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3">Company Facts</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!pr-20">We are proud of our works</h3>
           </div>
           <!-- /column -->
           <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
                 <p class="!mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
                 <p class="!mb-0">Happy Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
                 <p class="!mb-0">Expert Employees</p>
               </div>
@@ -850,26 +850,26 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px]"&#62;
                       &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full"&#62;
-                        &#60;h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3"&#62;Company Facts&#60;/h2&#62;
+                        &#60;h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3"&#62;Company Facts&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!pr-20"&#62;We are proud of our works&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                       &#60;div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full"&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center"&#62;
                           &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;7518&#60;/h3&#62;
                             &#60;p class="!mb-0"&#62;Completed Projects&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
                           &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;3472&#60;/h3&#62;
                             &#60;p class="!mb-0"&#62;Happy Customers&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
                           &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;2184&#60;/h3&#62;
                             &#60;p class="!mb-0"&#62;Expert Employees&#60;/p&#62;
                           &#60;/div&#62;
@@ -1009,17 +1009,17 @@
           <div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">7518</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">7518</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">5472</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">5472</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">2184</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">2184</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Expert Employees</p>
               </div>
               <!--/column -->
@@ -1058,17 +1058,17 @@
                         &#60;div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"&#62;
                           &#60;div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0"&#62;
                             &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0"&#62;
-                              &#60;h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]"&#62;7518&#60;/h3&#62;
+                              &#60;h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]"&#62;7518&#60;/h3&#62;
                               &#60;p class=" text-[0.8rem] font-medium !mb-0"&#62;Completed Projects&#60;/p&#62;
                             &#60;/div&#62;
                             &#60;!--/column --&#62;
                             &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0"&#62;
-                              &#60;h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]"&#62;5472&#60;/h3&#62;
+                              &#60;h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]"&#62;5472&#60;/h3&#62;
                               &#60;p class=" text-[0.8rem] font-medium !mb-0"&#62;Satisfied Customers&#60;/p&#62;
                             &#60;/div&#62;
                             &#60;!--/column --&#62;
                             &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0"&#62;
-                              &#60;h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]"&#62;2184&#60;/h3&#62;
+                              &#60;h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]"&#62;2184&#60;/h3&#62;
                               &#60;p class=" text-[0.8rem] font-medium !mb-0"&#62;Expert Employees&#60;/p&#62;
                             &#60;/div&#62;
                             &#60;!--/column --&#62;
@@ -1255,25 +1255,25 @@
           <div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center">
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
                 <p class="!m-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
                 <p class="!m-0">Happy Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
                 <p class="!m-0">Expert Employees</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 m-[0_auto]"><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">4523</h3>
                 <p class="!m-0">Awards Won</p>
               </div>
@@ -1301,25 +1301,25 @@
                       &#60;div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center"&#62;
                           &#60;div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;7518&#60;/h3&#62;
                             &#60;p class="!m-0"&#62;Completed Projects&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
                           &#60;div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;3472&#60;/h3&#62;
                             &#60;p class="!m-0"&#62;Happy Customers&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
                           &#60;div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;2184&#60;/h3&#62;
                             &#60;p class="!m-0"&#62;Expert Employees&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
                           &#60;div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
-                            &#60;img src="../../assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 m-[0_auto]" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 m-[0_auto]" alt="image"&#62;
                             &#60;h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2"&#62;4523&#60;/h3&#62;
                             &#60;p class="!m-0"&#62;Awards Won&#60;/p&#62;
                           &#60;/div&#62;
@@ -1536,7 +1536,7 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] px-[7.5px] !mt-[50px] xl:!mt-0 lg:!mt-0 max-w-full !mr-auto">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]">Our Solutions</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]">Our Solutions</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-5 xxl:!pr-5">Just sit & relax while we take care of your business needs.</h3>
             <p class="!mb-6">Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus. Maecenas sed diam eget risus varius blandit sit amet non magna. Praesent commodo cursus magna.</p>
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px]">
@@ -1577,7 +1577,7 @@
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] px-[7.5px] !mt-[50px] xl:!mt-0 lg:!mt-0 max-w-full !mr-auto"&#62;
-                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]"&#62;Our Solutions&#60;/h2&#62;
+                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]"&#62;Our Solutions&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-5 xxl:!pr-5"&#62;Just sit &#38; relax while we take care of your business needs.&#60;/h3&#62;
                         &#60;p class="!mb-6"&#62;Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus. Maecenas sed diam eget risus varius blandit sit amet non magna. Praesent commodo cursus magna.&#60;/p&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px]"&#62;
@@ -1632,9 +1632,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/faq.html b/public/docs/blocks/faq.html
index 3e32578..9b06037 100644
--- a/public/docs/blocks/faq.html
+++ b/public/docs/blocks/faq.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -581,7 +581,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='clients.html'>Clients</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='contact.html'>Contact</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='facts.html'>Facts</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='faq.html'>FAQ</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='faq.html'>FAQ</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='features.html'>Features</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='footer.html'>Footer</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='hero.html'>Hero</a></li>
@@ -610,7 +610,7 @@
             <div class="accordion accordion-wrapper" id="accordionExample-2">
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne-2">
-                  <button class="hover:!text-[#3f78e0] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne-2" aria-expanded="true" aria-controls="collapseOne-2"> Can I cancel my subscription? </button>
+                  <button class="hover:!text-[#e31e24] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne-2" aria-expanded="true" aria-controls="collapseOne-2"> Can I cancel my subscription? </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseOne-2" class="accordion-collapse collapse show" aria-labelledby="headingOne-2" data-bs-parent="#accordionExample-2">
@@ -624,7 +624,7 @@
               <!--/.accordion-item -->
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo-2">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo-2" aria-expanded="false" aria-controls="collapseTwo-2"> Which payment methods do you accept? </button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo-2" aria-expanded="false" aria-controls="collapseTwo-2"> Which payment methods do you accept? </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseTwo-2" class="accordion-collapse collapse" aria-labelledby="headingTwo-2" data-bs-parent="#accordionExample-2">
@@ -638,7 +638,7 @@
               <!--/.accordion-item -->
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree-2">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree-2" aria-expanded="false" aria-controls="collapseThree-2"> How can I manage my Account? </button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree-2" aria-expanded="false" aria-controls="collapseThree-2"> How can I manage my Account? </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseThree-2" class="accordion-collapse collapse" aria-labelledby="headingThree-2" data-bs-parent="#accordionExample-2">
@@ -680,7 +680,7 @@
                         &#60;div class="accordion accordion-wrapper" id="accordionExample-2"&#62;
                           &#60;div class="card plain accordion-item"&#62;
                             &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne-2"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne-2" aria-expanded="true" aria-controls="collapseOne-2"&#62; Can I cancel my subscription? &#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] accordion-button" data-bs-toggle="collapse" data-bs-target="#collapseOne-2" aria-expanded="true" aria-controls="collapseOne-2"&#62; Can I cancel my subscription? &#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-header --&#62;
                             &#60;div id="collapseOne-2" class="accordion-collapse collapse show" aria-labelledby="headingOne-2" data-bs-parent="#accordionExample-2"&#62;
@@ -694,7 +694,7 @@
                           &#60;!--/.accordion-item --&#62;
                           &#60;div class="card plain accordion-item"&#62;
                             &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo-2"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo-2" aria-expanded="false" aria-controls="collapseTwo-2"&#62; Which payment methods do you accept? &#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo-2" aria-expanded="false" aria-controls="collapseTwo-2"&#62; Which payment methods do you accept? &#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-header --&#62;
                             &#60;div id="collapseTwo-2" class="accordion-collapse collapse" aria-labelledby="headingTwo-2" data-bs-parent="#accordionExample-2"&#62;
@@ -708,7 +708,7 @@
                           &#60;!--/.accordion-item --&#62;
                           &#60;div class="card plain accordion-item"&#62;
                             &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree-2"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree-2" aria-expanded="false" aria-controls="collapseThree-2"&#62; How can I manage my Account? &#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree-2" aria-expanded="false" aria-controls="collapseThree-2"&#62; How can I manage my Account? &#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-header --&#62;
                             &#60;div id="collapseThree-2" class="accordion-collapse collapse" aria-labelledby="headingThree-2" data-bs-parent="#accordionExample-2"&#62;
@@ -745,17 +745,17 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px]">
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px] !mb-0">
-            <h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3">FAQ</h2>
+            <h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3">FAQ</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-4">If you don't see an answer to your question, you can send us an email from our contact form.</h3>
             <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-6">Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam quis risus eget urna mollis ornare.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">All FAQ</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">All FAQ</a>
           </div>
           <!--/column -->
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
             <div id="accordion-3" class="accordion-wrapper">
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-1">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-1" class="collapse" aria-labelledby="accordion-heading-3-1" data-bs-target="#accordion-3">
@@ -769,7 +769,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-2">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-2" class="collapse" aria-labelledby="accordion-heading-3-2" data-bs-target="#accordion-3">
@@ -783,7 +783,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-3">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-3" class="collapse" aria-labelledby="accordion-heading-3-3" data-bs-target="#accordion-3">
@@ -797,7 +797,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-4">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-4" class="collapse" aria-labelledby="accordion-heading-3-4" data-bs-target="#accordion-3">
@@ -830,17 +830,17 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px]"&#62;
                       &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px] !mb-0"&#62;
-                        &#60;h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3"&#62;FAQ&#60;/h2&#62;
+                        &#60;h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3"&#62;FAQ&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-4"&#62;If you don't see an answer to your question, you can send us an email from our contact form.&#60;/h3&#62;
                         &#60;p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-6"&#62;Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Nullam quis risus eget urna mollis ornare.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;All FAQ&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;All FAQ&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#62;
                         &#60;div id="accordion-3" class="accordion-wrapper"&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-1"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1"&#62;How do I get my subscription receipt?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1"&#62;How do I get my subscription receipt?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-3-1" class="collapse" aria-labelledby="accordion-heading-3-1" data-bs-target="#accordion-3"&#62;
@@ -854,7 +854,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-2"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2"&#62;Are there any discounts for people in need?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2"&#62;Are there any discounts for people in need?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-3-2" class="collapse" aria-labelledby="accordion-heading-3-2" data-bs-target="#accordion-3"&#62;
@@ -868,7 +868,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-3"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3"&#62;Do you offer a free trial edit?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3"&#62;Do you offer a free trial edit?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-3-3" class="collapse" aria-labelledby="accordion-heading-3-3" data-bs-target="#accordion-3"&#62;
@@ -882,7 +882,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-3-4"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4"&#62;How do I reset my Account password?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4"&#62;How do I reset my Account password?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-3-4" class="collapse" aria-labelledby="accordion-heading-3-4" data-bs-target="#accordion-3"&#62;
@@ -924,7 +924,7 @@
             <div id="accordion-1" class="accordion-wrapper">
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-1">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-1" aria-expanded="false" aria-controls="accordion-collapse-1-1">Can I cancel my subscription?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-1" aria-expanded="false" aria-controls="accordion-collapse-1-1">Can I cancel my subscription?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-1" class="collapse" aria-labelledby="accordion-heading-1-1" data-bs-target="#accordion-1">
@@ -938,7 +938,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-2">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-2" aria-expanded="false" aria-controls="accordion-collapse-1-2">Which payment methods do you accept?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-2" aria-expanded="false" aria-controls="accordion-collapse-1-2">Which payment methods do you accept?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-2" class="collapse" aria-labelledby="accordion-heading-1-2" data-bs-target="#accordion-1">
@@ -952,7 +952,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-3">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-3" aria-expanded="false" aria-controls="accordion-collapse-1-3">How can I manage my Account?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-3" aria-expanded="false" aria-controls="accordion-collapse-1-3">How can I manage my Account?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-3" class="collapse" aria-labelledby="accordion-heading-1-3" data-bs-target="#accordion-1">
@@ -966,7 +966,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-4">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-4" aria-expanded="false" aria-controls="accordion-collapse-1-4">Is my credit card information secure?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-4" aria-expanded="false" aria-controls="accordion-collapse-1-4">Is my credit card information secure?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-4" class="collapse" aria-labelledby="accordion-heading-1-4" data-bs-target="#accordion-1">
@@ -986,7 +986,7 @@
             <div id="accordion-2" class="accordion-wrapper">
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-1">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-1" aria-expanded="false" aria-controls="accordion-collapse-2-1">How do I get my subscription receipt?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-1" aria-expanded="false" aria-controls="accordion-collapse-2-1">How do I get my subscription receipt?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-1" class="collapse" aria-labelledby="accordion-heading-2-1" data-bs-target="#accordion-2">
@@ -1000,7 +1000,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-2">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-2" aria-expanded="false" aria-controls="accordion-collapse-2-2">Are there any discounts for people in need?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-2" aria-expanded="false" aria-controls="accordion-collapse-2-2">Are there any discounts for people in need?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-2" class="collapse" aria-labelledby="accordion-heading-2-2" data-bs-target="#accordion-2">
@@ -1014,7 +1014,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-3">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-3" aria-expanded="false" aria-controls="accordion-collapse-2-3">Do you offer a free trial edit?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-3" aria-expanded="false" aria-controls="accordion-collapse-2-3">Do you offer a free trial edit?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-3" class="collapse" aria-labelledby="accordion-heading-2-3" data-bs-target="#accordion-2">
@@ -1028,7 +1028,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-4">
-                  <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-4" aria-expanded="false" aria-controls="accordion-collapse-2-4">How do I reset my Account password?</button>
+                  <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-4" aria-expanded="false" aria-controls="accordion-collapse-2-4">How do I reset my Account password?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-4" class="collapse" aria-labelledby="accordion-heading-2-4" data-bs-target="#accordion-2">
@@ -1066,7 +1066,7 @@
                         &#60;div id="accordion-1" class="accordion-wrapper"&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-1"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-1" aria-expanded="false" aria-controls="accordion-collapse-1-1"&#62;Can I cancel my subscription?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-1" aria-expanded="false" aria-controls="accordion-collapse-1-1"&#62;Can I cancel my subscription?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-1-1" class="collapse" aria-labelledby="accordion-heading-1-1" data-bs-target="#accordion-1"&#62;
@@ -1080,7 +1080,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-2"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-2" aria-expanded="false" aria-controls="accordion-collapse-1-2"&#62;Which payment methods do you accept?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-2" aria-expanded="false" aria-controls="accordion-collapse-1-2"&#62;Which payment methods do you accept?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-1-2" class="collapse" aria-labelledby="accordion-heading-1-2" data-bs-target="#accordion-1"&#62;
@@ -1094,7 +1094,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-3"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-3" aria-expanded="false" aria-controls="accordion-collapse-1-3"&#62;How can I manage my Account?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-3" aria-expanded="false" aria-controls="accordion-collapse-1-3"&#62;How can I manage my Account?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-1-3" class="collapse" aria-labelledby="accordion-heading-1-3" data-bs-target="#accordion-1"&#62;
@@ -1108,7 +1108,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-4"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-4" aria-expanded="false" aria-controls="accordion-collapse-1-4"&#62;Is my credit card information secure?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-4" aria-expanded="false" aria-controls="accordion-collapse-1-4"&#62;Is my credit card information secure?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-1-4" class="collapse" aria-labelledby="accordion-heading-1-4" data-bs-target="#accordion-1"&#62;
@@ -1128,7 +1128,7 @@
                         &#60;div id="accordion-2" class="accordion-wrapper"&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-1"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-1" aria-expanded="false" aria-controls="accordion-collapse-2-1"&#62;How do I get my subscription receipt?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-1" aria-expanded="false" aria-controls="accordion-collapse-2-1"&#62;How do I get my subscription receipt?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-2-1" class="collapse" aria-labelledby="accordion-heading-2-1" data-bs-target="#accordion-2"&#62;
@@ -1142,7 +1142,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-2"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-2" aria-expanded="false" aria-controls="accordion-collapse-2-2"&#62;Are there any discounts for people in need?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-2" aria-expanded="false" aria-controls="accordion-collapse-2-2"&#62;Are there any discounts for people in need?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-2-2" class="collapse" aria-labelledby="accordion-heading-2-2" data-bs-target="#accordion-2"&#62;
@@ -1156,7 +1156,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-3"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-3" aria-expanded="false" aria-controls="accordion-collapse-2-3"&#62;Do you offer a free trial edit?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-3" aria-expanded="false" aria-controls="accordion-collapse-2-3"&#62;Do you offer a free trial edit?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-2-3" class="collapse" aria-labelledby="accordion-heading-2-3" data-bs-target="#accordion-2"&#62;
@@ -1170,7 +1170,7 @@
                           &#60;!-- /.card --&#62;
                           &#60;div class="card accordion-item !mb-5"&#62;
                             &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-4"&#62;
-                              &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-4" aria-expanded="false" aria-controls="accordion-collapse-2-4"&#62;How do I reset my Account password?&#60;/button&#62;
+                              &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-4" aria-expanded="false" aria-controls="accordion-collapse-2-4"&#62;How do I reset my Account password?&#60;/button&#62;
                             &#60;/div&#62;
                             &#60;!-- /.card-header --&#62;
                             &#60;div id="accordion-collapse-2-4" class="collapse" aria-labelledby="accordion-heading-2-4" data-bs-target="#accordion-2"&#62;
@@ -1217,7 +1217,7 @@
                 <div class="accordion accordion-wrapper" id="accordionExample">
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne">
-                      <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">How do I get my subscription receipt?</button>
+                      <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne">How do I get my subscription receipt?</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
@@ -1231,7 +1231,7 @@
                   <!--/.accordion-item -->
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo">
-                      <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Are there any discounts for people in need?</button>
+                      <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">Are there any discounts for people in need?</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
@@ -1245,7 +1245,7 @@
                   <!--/.accordion-item -->
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree">
-                      <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">Do you offer a free trial edit?</button>
+                      <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">Do you offer a free trial edit?</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
@@ -1259,7 +1259,7 @@
                   <!--/.accordion-item -->
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingFour">
-                      <button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">How do I reset my Account password?</button>
+                      <button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">How do I reset my Account password?</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionExample">
@@ -1306,7 +1306,7 @@
                             &#60;div class="accordion accordion-wrapper" id="accordionExample"&#62;
                               &#60;div class="card plain accordion-item"&#62;
                                 &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne"&#62;
-                                  &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"&#62;How do I get my subscription receipt?&#60;/button&#62;
+                                  &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"&#62;How do I get my subscription receipt?&#60;/button&#62;
                                 &#60;/div&#62;
                                 &#60;!--/.card-header --&#62;
                                 &#60;div id="collapseOne" class="accordion-collapse collapse" aria-labelledby="headingOne" data-bs-parent="#accordionExample"&#62;
@@ -1320,7 +1320,7 @@
                               &#60;!--/.accordion-item --&#62;
                               &#60;div class="card plain accordion-item"&#62;
                                 &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo"&#62;
-                                  &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"&#62;Are there any discounts for people in need?&#60;/button&#62;
+                                  &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"&#62;Are there any discounts for people in need?&#60;/button&#62;
                                 &#60;/div&#62;
                                 &#60;!--/.card-header --&#62;
                                 &#60;div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample"&#62;
@@ -1334,7 +1334,7 @@
                               &#60;!--/.accordion-item --&#62;
                               &#60;div class="card plain accordion-item"&#62;
                                 &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree"&#62;
-                                  &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"&#62;Do you offer a free trial edit?&#60;/button&#62;
+                                  &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"&#62;Do you offer a free trial edit?&#60;/button&#62;
                                 &#60;/div&#62;
                                 &#60;!--/.card-header --&#62;
                                 &#60;div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample"&#62;
@@ -1348,7 +1348,7 @@
                               &#60;!--/.accordion-item --&#62;
                               &#60;div class="card plain accordion-item"&#62;
                                 &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingFour"&#62;
-                                  &#60;button class="hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour"&#62;How do I reset my Account password?&#60;/button&#62;
+                                  &#60;button class="hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour"&#62;How do I reset my Account password?&#60;/button&#62;
                                 &#60;/div&#62;
                                 &#60;!--/.card-header --&#62;
                                 &#60;div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour" data-bs-parent="#accordionExample"&#62;
@@ -1391,7 +1391,7 @@
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
             <div class="flex flex-row">
               <div>
-                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
+                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
               </div>
               <div>
                 <h4>Can I cancel my subscription?</h4>
@@ -1403,7 +1403,7 @@
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
             <div class="flex flex-row">
               <div>
-                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
+                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
               </div>
               <div>
                 <h4>Which payment methods do you accept?</h4>
@@ -1415,7 +1415,7 @@
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
             <div class="flex flex-row">
               <div>
-                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
+                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
               </div>
               <div>
                 <h4>How can I manage my Account?</h4>
@@ -1427,7 +1427,7 @@
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
             <div class="flex flex-row">
               <div>
-                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
+                <span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"><i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"></i></span>
               </div>
               <div>
                 <h4>Is my credit card information secure?</h4>
@@ -1455,7 +1455,7 @@
                       &#38;#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#38;#62;
                         &#38;#60;div class="flex flex-row"&#38;#62;
                           &#38;#60;div&#38;#62;
-                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
+                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
                           &#38;#60;/div&#38;#62;
                           &#38;#60;div&#38;#62;
                             &#38;#60;h4&#38;#62;Can I cancel my subscription?&#38;#60;/h4&#38;#62;
@@ -1467,7 +1467,7 @@
                       &#38;#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#38;#62;
                         &#38;#60;div class="flex flex-row"&#38;#62;
                           &#38;#60;div&#38;#62;
-                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
+                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
                           &#38;#60;/div&#38;#62;
                           &#38;#60;div&#38;#62;
                             &#38;#60;h4&#38;#62;Which payment methods do you accept?&#38;#60;/h4&#38;#62;
@@ -1479,7 +1479,7 @@
                       &#38;#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#38;#62;
                         &#38;#60;div class="flex flex-row"&#38;#62;
                           &#38;#60;div&#38;#62;
-                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
+                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
                           &#38;#60;/div&#38;#62;
                           &#38;#60;div&#38;#62;
                             &#38;#60;h4&#38;#62;How can I manage my Account?&#38;#60;/h4&#38;#62;
@@ -1491,7 +1491,7 @@
                       &#38;#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#38;#62;
                         &#38;#60;div class="flex flex-row"&#38;#62;
                           &#38;#60;div&#38;#62;
-                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
+                            &#38;#60;span class="icon btn btn-sm btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[1.8rem] h-[1.8rem] text-[0.8rem] inline-flex items-center justify-center !leading-none !p-0 !rounded-[100%]"&#38;#62;&#38;#60;i class="uil uil-comment-exclamation before:content-['\ea41'] text-[.85rem]"&#38;#62;&#38;#60;/i&#38;#62;&#38;#60;/span&#38;#62;
                           &#38;#60;/div&#38;#62;
                           &#38;#60;div&#38;#62;
                             &#38;#60;h4&#38;#62;Is my credit card information secure?&#38;#60;/h4&#38;#62;
@@ -1535,9 +1535,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/features.html b/public/docs/blocks/features.html
index b14c502..f38c601 100644
--- a/public/docs/blocks/features.html
+++ b/public/docs/blocks/features.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -582,7 +582,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='contact.html'>Contact</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='facts.html'>Facts</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='faq.html'>FAQ</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='features.html'>Features</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='features.html'>Features</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='footer.html'>Footer</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='hero.html'>Hero</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='misc.html'>Misc</a></li>
@@ -833,7 +833,7 @@
             <div class="icon btn btn-block btn-lg btn-soft-blue pointer-events-none !mb-5"> <i class="uil uil-chart-line before:content-['\e9d3']"></i> </div>
             <h4>Market Research</h4>
             <p class="!mb-3">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo.</p>
-            <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+            <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
           </div>
           <!--/column -->
         </div>
@@ -885,7 +885,7 @@
                         &#60;div class="icon btn btn-block btn-lg btn-soft-blue pointer-events-none !mb-5"&#62; &#60;i class="uil uil-chart-line before:content-['\e9d3']"&#62;&#60;/i&#62; &#60;/div&#62;
                         &#60;h4&#62;Market Research&#60;/h4&#62;
                         &#60;p class="!mb-3"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo.&#60;/p&#62;
-                        &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                        &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
@@ -961,10 +961,10 @@
             <div class="md:w-6/12 lg:w-6/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] max-w-full !mt-[25px]">
               <div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
                 <div class="card-body flex-[1_1_auto] p-[40px]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#3f78e0] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#e31e24] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
                   <h4>Content Marketing</h4>
                   <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.</p>
-                  <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                  <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -1042,10 +1042,10 @@
                         &#60;div class="md:w-6/12 lg:w-6/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] max-w-full !mt-[25px]"&#62;
                           &#60;div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]"&#62;
                             &#60;div class="card-body flex-[1_1_auto] p-[40px]"&#62;
-                              &#60;img src="../../assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#3f78e0] text-blue !mb-3  m-[0_auto]" alt="image"&#62;
+                              &#60;img src="../../assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#e31e24] text-blue !mb-3  m-[0_auto]" alt="image"&#62;
                               &#60;h4&#62;Content Marketing&#60;/h4&#62;
                               &#60;p class="!mb-2"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.&#60;/p&#62;
-                              &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                              &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-body --&#62;
                           &#60;/div&#62;
@@ -1115,7 +1115,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !self-start !mt-[25px]">
                 <div class="card !bg-[#e0e9fa]">
                   <div class="card-body p-[40px]">
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" class="icon-svg icon-svg-md !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"/><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"/><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"/><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"/></svg>
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" class="icon-svg icon-svg-md !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"/><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"/><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"/><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"/></svg>
                     <h4>Market Research</h4>
                     <p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget.</p>
                   </div>
@@ -1192,7 +1192,7 @@
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !self-start !mt-[25px]"&#62;
                             &#60;div class="card !bg-[#e0e9fa]"&#62;
                               &#60;div class="card-body p-[40px]"&#62;
-                                &#60;img src="../../assets/img/icons/lineal/analytics.svg" class="icon-svg icon-svg-md !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem]" alt="image"&#62;
+                                &#60;img src="../../assets/img/icons/lineal/analytics.svg" class="icon-svg icon-svg-md !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem]" alt="image"&#62;
                                 &#60;h4&#62;Market Research&#60;/h4&#62;
                                 &#60;p class="!mb-0"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget.&#60;/p&#62;
                               &#60;/div&#62;
@@ -1376,15 +1376,15 @@
             <div class="flex flex-wrap mx-[-15px] !mt-[-15px]">
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean quam ornare. Curabitur blandit.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean quam ornare. Curabitur blandit.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare.</span></li>
                 </ul>
               </div>
               <!--/column -->
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta euismod malesuada mollis.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Vivamus sagittis lacus vel augue rutrum.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta euismod malesuada mollis.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Vivamus sagittis lacus vel augue rutrum.</span></li>
                 </ul>
               </div>
               <!--/column -->
@@ -1418,15 +1418,15 @@
                         &#60;div class="flex flex-wrap mx-[-15px] !mt-[-15px]"&#62;
                           &#60;div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full"&#62;
                             &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0"&#62;
-                              &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Aenean quam ornare. Curabitur blandit.&#60;/span&#62;&#60;/li&#62;
-                              &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Nullam quis risus eget urna mollis ornare.&#60;/span&#62;&#60;/li&#62;
+                              &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Aenean quam ornare. Curabitur blandit.&#60;/span&#62;&#60;/li&#62;
+                              &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Nullam quis risus eget urna mollis ornare.&#60;/span&#62;&#60;/li&#62;
                             &#60;/ul&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
                           &#60;div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full"&#62;
                             &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0"&#62;
-                              &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Etiam porta euismod malesuada mollis.&#60;/span&#62;&#60;/li&#62;
-                              &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Vivamus sagittis lacus vel augue rutrum.&#60;/span&#62;&#60;/li&#62;
+                              &#60;li class="relative !pl-6"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Etiam porta euismod malesuada mollis.&#60;/span&#62;&#60;/li&#62;
+                              &#60;li class="relative !pl-6 !mt-3"&#62;&#60;span&#62;&#60;i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Vivamus sagittis lacus vel augue rutrum.&#60;/span&#62;&#60;/li&#62;
                             &#60;/ul&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
@@ -1491,7 +1491,7 @@
           </div>
           <!--/column -->
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 327.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#3f78e0] text-blue !mb-3  m-[0_auto]"><path class="lineal-fill" d="M313.7 72.3V47c0-18.4-14.9-33.2-33.2-33.2H47c-18.4 0-33.2 14.9-33.2 33.2v25.3h299.9zM13.8 398.4V465c0 18.4 14.9 33.2 33.2 33.2h233.4c18.4 0 33.2-14.9 33.2-33.2v-66.6H13.8z"></path><path class="lineal-stroke" d="M280.4 0H47C21.1 0 0 21.1 0 47v418c0 25.9 21.1 47 47 47h233.4c25.9 0 47-21.1 47-47V352.3c0-7.6-6.2-13.8-13.8-13.7-7.6 0-13.7 6.2-13.7 13.7v32.3H27.5V86.1h272.4V256c0 7.6 6.1 13.8 13.7 13.8s13.8-6.1 13.8-13.7V47c0-25.9-21-47-47-47zm19.5 412.1V465c0 10.8-8.7 19.5-19.5 19.5H47c-10.8 0-19.5-8.7-19.5-19.5v-52.9h272.4zM27.5 58.6V47c0-10.8 8.7-19.5 19.5-19.5h233.4c10.8 0 19.5 8.7 19.5 19.5v11.6H27.5z"></path><circle cx="163.7" cy="448.3" r="9.4"></circle><path class="lineal-stroke" d="M163.7 471.5c-12.8 0-23.2-10.4-23.2-23.2 0-12.8 10.4-23.2 23.2-23.2s23.2 10.4 23.2 23.2-10.4 23.2-23.2 23.2zm-25.4-248.1H69.5c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.8 6.2 13.8 13.8s-6.2 13.8-13.8 13.8h-55v32.1h55c7.6 0 13.8 6.2 13.8 13.8-.1 7.5-6.2 13.7-13.8 13.7z"></path><path class="lineal-fill" d="M189.2 150H258v59.6h-68.8z"></path><path class="lineal-stroke" d="M258 223.4h-68.8c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.6-6.1 13.8-13.7 13.8zm-55-27.5h41.3v-32.1h-41.4l.1 32.1z"></path><path class="lineal-fill" d="M69.5 265.6h68.8v59.6H69.5z"></path><path class="lineal-stroke" d="M138.3 339H69.5c-7.6 0-13.8-6.2-13.8-13.8v-59.7c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.7-6.1 13.9-13.7 13.9zm-55-27.5h41.2v-32.1H83.2l.1 32.1zM258 339h-68.8c-7.6 0-13.8-6.2-13.7-13.8 0-7.6 6.2-13.7 13.7-13.7h55v-32.1h-55c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.8 6.2 13.8 13.8v59.6c0 7.6-6.2 13.8-13.8 13.8z"></path></svg>
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 327.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#e31e24] text-blue !mb-3  m-[0_auto]"><path class="lineal-fill" d="M313.7 72.3V47c0-18.4-14.9-33.2-33.2-33.2H47c-18.4 0-33.2 14.9-33.2 33.2v25.3h299.9zM13.8 398.4V465c0 18.4 14.9 33.2 33.2 33.2h233.4c18.4 0 33.2-14.9 33.2-33.2v-66.6H13.8z"></path><path class="lineal-stroke" d="M280.4 0H47C21.1 0 0 21.1 0 47v418c0 25.9 21.1 47 47 47h233.4c25.9 0 47-21.1 47-47V352.3c0-7.6-6.2-13.8-13.8-13.7-7.6 0-13.7 6.2-13.7 13.7v32.3H27.5V86.1h272.4V256c0 7.6 6.1 13.8 13.7 13.8s13.8-6.1 13.8-13.7V47c0-25.9-21-47-47-47zm19.5 412.1V465c0 10.8-8.7 19.5-19.5 19.5H47c-10.8 0-19.5-8.7-19.5-19.5v-52.9h272.4zM27.5 58.6V47c0-10.8 8.7-19.5 19.5-19.5h233.4c10.8 0 19.5 8.7 19.5 19.5v11.6H27.5z"></path><circle cx="163.7" cy="448.3" r="9.4"></circle><path class="lineal-stroke" d="M163.7 471.5c-12.8 0-23.2-10.4-23.2-23.2 0-12.8 10.4-23.2 23.2-23.2s23.2 10.4 23.2 23.2-10.4 23.2-23.2 23.2zm-25.4-248.1H69.5c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.8 6.2 13.8 13.8s-6.2 13.8-13.8 13.8h-55v32.1h55c7.6 0 13.8 6.2 13.8 13.8-.1 7.5-6.2 13.7-13.8 13.7z"></path><path class="lineal-fill" d="M189.2 150H258v59.6h-68.8z"></path><path class="lineal-stroke" d="M258 223.4h-68.8c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.6-6.1 13.8-13.7 13.8zm-55-27.5h41.3v-32.1h-41.4l.1 32.1z"></path><path class="lineal-fill" d="M69.5 265.6h68.8v59.6H69.5z"></path><path class="lineal-stroke" d="M138.3 339H69.5c-7.6 0-13.8-6.2-13.8-13.8v-59.7c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.7-6.1 13.9-13.7 13.9zm-55-27.5h41.2v-32.1H83.2l.1 32.1zM258 339h-68.8c-7.6 0-13.8-6.2-13.7-13.8 0-7.6 6.2-13.7 13.7-13.7h55v-32.1h-55c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.8 6.2 13.8 13.8v59.6c0 7.6-6.2 13.8-13.8 13.8z"></path></svg>
             <h4>Mobile Design</h4>
             <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
           </div>
@@ -1561,7 +1561,7 @@
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full"&#62;
-                        &#60;img src="../../assets/img/icons/lineal/smartphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#3f78e0] text-blue !mb-3  m-[0_auto]" alt="image"&#62;
+                        &#60;img src="../../assets/img/icons/lineal/smartphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#e31e24] text-blue !mb-3  m-[0_auto]" alt="image"&#62;
                         &#60;h4&#62;Mobile Design&#60;/h4&#62;
                         &#60;p class="!mb-2"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.&#60;/p&#62;
                       &#60;/div&#62;
@@ -2439,7 +2439,7 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full">
             <div class="flex flex-row">
               <div>
-                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h4>24/7 Support</h4>
@@ -2452,7 +2452,7 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full">
             <div class="flex flex-row">
               <div>
-                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-laptop-cloud before:content-['\ebb2']"></i> </div>
+                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-laptop-cloud before:content-['\ebb2']"></i> </div>
               </div>
               <div>
                 <h4>Daily Updates</h4>
@@ -2465,7 +2465,7 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full">
             <div class="flex flex-row">
               <div>
-                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-chart-line before:content-['\e9d3']"></i> </div>
+                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-chart-line before:content-['\e9d3']"></i> </div>
               </div>
               <div>
                 <h4>Market Research</h4>
@@ -2494,7 +2494,7 @@
                       &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4&#62;24/7 Support&#60;/h4&#62;
@@ -2507,7 +2507,7 @@
                       &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62; &#60;i class="uil uil-laptop-cloud before:content-['\ebb2']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62; &#60;i class="uil uil-laptop-cloud before:content-['\ebb2']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4&#62;Daily Updates&#60;/h4&#62;
@@ -2520,7 +2520,7 @@
                       &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62; &#60;i class="uil uil-chart-line before:content-['\e9d3']"&#62;&#60;/i&#62; &#60;/div&#62;
+                            &#60;div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62; &#60;i class="uil uil-chart-line before:content-['\e9d3']"&#62;&#60;/i&#62; &#60;/div&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4&#62;Market Research&#60;/h4&#62;
@@ -2551,7 +2551,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="md:w-10/12 xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] md:!ml-[8.33333333%]">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]">What We Do?</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]">What We Do?</h2>
             <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-10 xxl:!px-10">The service we offer is specifically designed to meet your needs.</h3>
           </div>
           <!-- /column -->
@@ -2605,7 +2605,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] !text-center"&#62;
                       &#60;div class="md:w-10/12 xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[16.66666667%] lg:!ml-[16.66666667%] md:!ml-[8.33333333%]"&#62;
-                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]"&#62;What We Do?&#60;/h2&#62;
+                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]"&#62;What We Do?&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-10 xxl:!px-10"&#62;The service we offer is specifically designed to meet your needs.&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
@@ -2878,7 +2878,7 @@
             <h2 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-3">My Services</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">I would like to give you a unique photography experience, capture your products with excellent composition and lighting skills.</p>
             <p>Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis elit interdum. Duis mollis, est non commodo luctus, nisi erat ligula mollis metus auctor fringilla.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">More Details</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">More Details</a>
           </div>
           <!-- /column -->
         </div>
@@ -2965,7 +2965,7 @@
                         &#60;h2 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-3"&#62;My Services&#60;/h2&#62;
                         &#60;p class="lead !text-[1.05rem] !leading-[1.6] font-medium"&#62;I would like to give you a unique photography experience, capture your products with excellent composition and lighting skills.&#60;/p&#62;
                         &#60;p&#62;Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis elit interdum. Duis mollis, est non commodo luctus, nisi erat ligula mollis metus auctor fringilla.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;More Details&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;More Details&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
@@ -2992,7 +2992,7 @@
             <h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-3">My areas of <em>expertise</em></h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">The full service I am offering is specifically designed to meet your business needs.</p>
             <p>Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis elit interdum. Duis mollis, est non commodo luctus, nisi erat ligula magna mollis.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">More Details</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">More Details</a>
           </div>
           <!-- /column -->
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:px-0 lg:px-0 !px-[15px] max-w-full !mt-[50px]">
@@ -3005,7 +3005,7 @@
                         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/edit.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]"><path class="fill-primary" d="M152 0H29.33A29.32 29.32 0 000 29.33v165.33A29.32 29.32 0 0029.33 224h78.72l2.35-13.12a29.71 29.71 0 018.11-15.68l62.83-62.72V29.33A29.33 29.33 0 00152 0zM42.67 42.67h42.67a10.67 10.67 0 110 21.33H42.66a10.67 10.67 0 010-21.33zM96 149.33H42.67a10.67 10.67 0 110-21.33H96a10.67 10.67 0 110 21.33zm42.67-42.66h-96a10.67 10.67 0 010-21.34h96a10.67 10.67 0 110 21.34z"></path><path class="fill-secondary" d="M133.63 256a8 8 0 01-7.89-9.38l5.67-32.06a8 8 0 012.22-4.27l79.2-79.2c9.73-9.75 19.28-7.12 24.51-1.89l13.2 13.2a18.69 18.69 0 010 26.4l-79.2 79.2a7.83 7.83 0 01-4.27 2.22l-32 5.67a10.71 10.71 0 01-1.44.11zm32.05-13.65z"></path></svg>
                         <h3>Content Marketing</h3>
                         <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
-                        <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                        <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
                       </div>
                       <!--/.card-body -->
                     </div>
@@ -3018,7 +3018,7 @@
                         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/team.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]"><circle class="fill-primary" cx="128" cy="26.67" r="26.67"></circle><circle class="fill-primary" cx="202.67" cy="176" r="26.67"></circle><circle class="fill-primary" cx="53.33" cy="176" r="26.67"></circle><path class="fill-primary" d="M173.33 106.67H82.66a8 8 0 01-8-8v-5.33A29.35 29.35 0 01104 64h48a29.35 29.35 0 0129.33 29.32v5.33a8 8 0 01-8 8.02zM248 256h-90.67a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48A29.36 29.36 0 01256 242.67V248a8 8 0 01-8 8zm-149.33 0H8a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48a29.37 29.37 0 0129.33 29.33V248a8 8 0 01-8 8z"></path><path class="fill-secondary" d="M29.33 136.13a8 8 0 01-8-8 107.1 107.1 0 0161.73-96.77 8 8 0 116.73 14.51 91 91 0 00-52.48 82.26 8 8 0 01-7.98 8zm197.34 0a8 8 0 01-8-8 91 91 0 00-52.48-82.26 8 8 0 116.74-14.51 107.09 107.09 0 0161.73 96.77 8 8 0 01-8 8zM128 234.8a105.08 105.08 0 01-11.15-.58 8 8 0 011.66-15.9 93.73 93.73 0 0019.6-.06 8 8 0 011.76 15.9 110.68 110.68 0 01-11.87.64z"></path></svg>
                         <h3>Social Engagement</h3>
                         <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
-                        <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                        <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
                       </div>
                       <!--/.card-body -->
                     </div>
@@ -3037,7 +3037,7 @@
                         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/lamp.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]"><path class="fill-secondary" d="M128 36.86a8 8 0 01-8-8V8a8 8 0 0116 0v20.86a8 8 0 01-8 8zm70.1 29.04a8 8 0 01-5.67-13.64l14.77-14.77a8 8 0 1111.31 11.31l-14.77 14.77a8 8 0 01-5.64 2.33zM248 136h-20.86a8 8 0 010-16H248a8 8 0 010 16zm-35.15 84.85a8.06 8.06 0 01-5.67-2.34l-14.76-14.77a8 8 0 0111.31-11.31l14.77 14.77a8 8 0 010 11.31 7.92 7.92 0 01-5.65 2.34zm-169.7 0a8 8 0 01-5.66-13.65l14.77-14.77a8 8 0 0111.31 11.31L48.8 218.51a7.93 7.93 0 01-5.65 2.34zM28.86 136H8a8 8 0 010-16h20.86a8 8 0 110 16zM57.9 65.9a8 8 0 01-5.66-2.33L37.47 48.8a8 8 0 1111.31-11.31l14.77 14.77A8 8 0 0157.9 65.9z"></path><path class="fill-primary" d="M160 224v13.33A18.76 18.76 0 01141.33 256h-26.67c-9 0-18.66-6.83-18.66-21.76V224zm15-154a74.93 74.93 0 00-63-15c-28.27 5.91-51.2 29-57.07 57.21a74.74 74.74 0 0028.16 75.41A32.19 32.19 0 0195.25 208v.12A2 2 0 0196 208h64a.93.93 0 01.53.11V208c1.49-8.11 6.29-15.57 13.65-21.33A74.72 74.72 0 00175 70zm-7 63.36a8.06 8.06 0 01-8-8A29.32 29.32 0 00130.67 96a8 8 0 110-16A45.43 45.43 0 01176 125.33a8.06 8.06 0 01-8 8z"></path><path class="fill-secondary" d="M95.25 208H96a1.8 1.8 0 00-.75.11z"></path><path class="fill-primary" d="M160.53 208v.11a.93.93 0 00-.53-.11z"></path></svg>
                         <h3>Identity & Branding</h3>
                         <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
-                        <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                        <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
                       </div>
                       <!--/.card-body -->
                     </div>
@@ -3050,7 +3050,7 @@
                         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/delivery-box.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]"><path class="fill-secondary" d="M172 20.57L55.79 80 9.6 57.32 123.71 1A9.43 9.43 0 01132 1zm74.27 36.75l-118.21 58.56-44.27-21.8-6.38-3.25L193.7 31.36l6.4 3.24z"></path><path class="fill-primary" d="M118.59 132.76L118.46 256 5.23 196.91A9.89 9.89 0 010 188.22V74.2l48 23.64v41.55a9.6 9.6 0 1019.2 0v-31.94l6.4 3.12zm137.28-58.43l-118.08 58.31-.13 123.23L256 194.08z"></path></svg>
                         <h3>Product Design</h3>
                         <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.</p>
-                        <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                        <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
                       </div>
                       <!--/.card-body -->
                     </div>
@@ -3085,7 +3085,7 @@
                         &#60;h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-3"&#62;My areas of &#60;em&#62;expertise&#60;/em&#62;&#60;/h2&#62;
                         &#60;p class="lead !text-[1.05rem] !leading-[1.6] font-medium"&#62;The full service I am offering is specifically designed to meet your business needs.&#60;/p&#62;
                         &#60;p&#62;Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam quis risus eget urna mollis ornare vel eu leo. Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas faucibus mollis elit interdum. Duis mollis, est non commodo luctus, nisi erat ligula magna mollis.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;More Details&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;More Details&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                       &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:px-0 lg:px-0 !px-[15px] max-w-full !mt-[50px]"&#62;
@@ -3098,7 +3098,7 @@
                                     &#60;img src="../../assets/img/icons/solid/edit.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]" alt="image"&#62;
                                     &#60;h3&#62;Content Marketing&#60;/h3&#62;
                                     &#60;p class="!mb-2"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.&#60;/p&#62;
-                                    &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                                    &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                                   &#60;/div&#62;
                                   &#60;!--/.card-body --&#62;
                                 &#60;/div&#62;
@@ -3111,7 +3111,7 @@
                                     &#60;img src="../../assets/img/icons/solid/team.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]" alt="image"&#62;
                                     &#60;h3&#62;Social Engagement&#60;/h3&#62;
                                     &#60;p class="!mb-2"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.&#60;/p&#62;
-                                    &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                                    &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                                   &#60;/div&#62;
                                   &#60;!--/.card-body --&#62;
                                 &#60;/div&#62;
@@ -3130,7 +3130,7 @@
                                     &#60;img src="../../assets/img/icons/solid/lamp.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]" alt="image"&#62;
                                     &#60;h3&#62;Identity &#38; Branding&#60;/h3&#62;
                                     &#60;p class="!mb-2"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.&#60;/p&#62;
-                                    &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                                    &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                                   &#60;/div&#62;
                                   &#60;!--/.card-body --&#62;
                                 &#60;/div&#62;
@@ -3143,7 +3143,7 @@
                                     &#60;img src="../../assets/img/icons/solid/delivery-box.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-duo text-purple-aqua !mb-3 m-[0_auto]" alt="image"&#62;
                                     &#60;h3&#62;Product Design&#60;/h3&#62;
                                     &#60;p class="!mb-2"&#62;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida.&#60;/p&#62;
-                                    &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                                    &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                                   &#60;/div&#62;
                                   &#60;!--/.card-body --&#62;
                                 &#60;/div&#62;
@@ -3328,7 +3328,7 @@
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="md:w-10/12 lg:w-9/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14">
             <h2 class="!text-[0.8rem] !tracking-[0.02rem] uppercase !text-[#aab0bc] !mb-3 !leading-[1.35]">Our Services</h2>
-            <h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em] xxl:!px-8">The service we offer is <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"><em>designed</em></span> to meet your business needs.</h3>
+            <h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em] xxl:!px-8">The service we offer is <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"><em>designed</em></span> to meet your business needs.</h3>
           </div>
           <!-- /column -->
         </div>
@@ -3339,15 +3339,15 @@
           </div>
           <!-- /column -->
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto !mt-[50px]">
-            <div class="svg-bg !bg-[#e0e9fa] rounded !mb-5"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/like.svg" class="svg-inject icon-svg solid text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M226.67 21.33a8 8 0 018 8v144a8 8 0 01-8 8H107.31a21.3 21.3 0 00-15.09 6.25L64 215.81v-13.14a21.34 21.34 0 00-21.33-21.33H29.33a8 8 0 01-8-8v-144a8 8 0 018-8h197.34zm0-21.33H29.33A29.35 29.35 0 000 29.33v144a29.36 29.36 0 0029.33 29.33h13.33V248a8 8 0 004.94 7.39 7.82 7.82 0 003.07.61 8.09 8.09 0 005.67-2.34l51-51h119.35A29.36 29.36 0 00256 173.34v-144A29.39 29.39 0 00226.67 0z"></path><path class="fill-secondary" d="M96 146.67a10.67 10.67 0 01-10.67 10.67H74.66A10.68 10.68 0 0164 146.67v-64A10.67 10.67 0 0174.66 72h10.67A10.67 10.67 0 0196 82.67zm89.92-10.88C184 148.06 172.8 157.34 160 157.34h-8.11c-21.33 0-36.16-4-45.44-7.79a25.36 25.36 0 00.21-2.88v-64A21.24 21.24 0 00104 72.32c5.65-4.48 12.69-11.73 12.69-19.84 0-6.61 0-20.27 12.8-20.27 8.53 0 17.81 7.89 17.81 25.17A48.86 48.86 0 01145 72h21.23A25.76 25.76 0 01192 97.71c0 .32-1.28 27.09-6.51 38z"></path></g></svg> </div>
+            <div class="svg-bg !bg-[#e0e9fa] rounded !mb-5"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/like.svg" class="svg-inject icon-svg solid text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M226.67 21.33a8 8 0 018 8v144a8 8 0 01-8 8H107.31a21.3 21.3 0 00-15.09 6.25L64 215.81v-13.14a21.34 21.34 0 00-21.33-21.33H29.33a8 8 0 01-8-8v-144a8 8 0 018-8h197.34zm0-21.33H29.33A29.35 29.35 0 000 29.33v144a29.36 29.36 0 0029.33 29.33h13.33V248a8 8 0 004.94 7.39 7.82 7.82 0 003.07.61 8.09 8.09 0 005.67-2.34l51-51h119.35A29.36 29.36 0 00256 173.34v-144A29.39 29.39 0 00226.67 0z"></path><path class="fill-secondary" d="M96 146.67a10.67 10.67 0 01-10.67 10.67H74.66A10.68 10.68 0 0164 146.67v-64A10.67 10.67 0 0174.66 72h10.67A10.67 10.67 0 0196 82.67zm89.92-10.88C184 148.06 172.8 157.34 160 157.34h-8.11c-21.33 0-36.16-4-45.44-7.79a25.36 25.36 0 00.21-2.88v-64A21.24 21.24 0 00104 72.32c5.65-4.48 12.69-11.73 12.69-19.84 0-6.61 0-20.27 12.8-20.27 8.53 0 17.81 7.89 17.81 25.17A48.86 48.86 0 01145 72h21.23A25.76 25.76 0 01192 97.71c0 .32-1.28 27.09-6.51 38z"></path></g></svg> </div>
             <h3 class="h1 !leading-[1.3] post-title !tracking-[-0.03em] !mb-3">Social Media Marketing</h3>
             <p>Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus.</p>
             <ul class="pl-0 list-none bullet-bg bullet-soft-primary">
-              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
+              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
             </ul>
-            <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+            <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
           </div>
           <!-- /column -->
         </div>
@@ -3387,7 +3387,7 @@
                     &#60;div class="flex flex-wrap mx-[-15px] !text-center"&#62;
                       &#60;div class="md:w-10/12 lg:w-9/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14"&#62;
                         &#60;h2 class="!text-[0.8rem] !tracking-[0.02rem] uppercase !text-[#aab0bc] !mb-3 !leading-[1.35]"&#62;Our Services&#60;/h2&#62;
-                        &#60;h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em] xxl:!px-8"&#62;The service we offer is &#60;span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"&#62;&#60;em&#62;designed&#60;/em&#62;&#60;/span&#62; to meet your business needs.&#60;/h3&#62;
+                        &#60;h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em] xxl:!px-8"&#62;The service we offer is &#60;span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"&#62;&#60;em&#62;designed&#60;/em&#62;&#60;/span&#62; to meet your business needs.&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
@@ -3398,15 +3398,15 @@
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                       &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto !mt-[50px]"&#62;
-                        &#60;div class="svg-bg !bg-[#e0e9fa] rounded !mb-5"&#62; &#60;img src="../../assets/img/icons/solid/like.svg" class="svg-inject icon-svg solid !text-[#3f78e0] " alt="image"&#62; &#60;/div&#62;
+                        &#60;div class="svg-bg !bg-[#e0e9fa] rounded !mb-5"&#62; &#60;img src="../../assets/img/icons/solid/like.svg" class="svg-inject icon-svg solid !text-[#e31e24] " alt="image"&#62; &#60;/div&#62;
                         &#60;h3 class="h1 !leading-[1.3] post-title !tracking-[-0.03em] !mb-3"&#62;Social Media Marketing&#60;/h3&#62;
                         &#60;p&#62;Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus.&#60;/p&#62;
                         &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary"&#62;
-                          &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Aenean eu leo quam. Pellentesque ornare.&#60;/li&#62;
-                          &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Nullam quis risus eget urna mollis ornare.&#60;/li&#62;
-                          &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Fusce dapibus, tellus ac cursus commodo.&#60;/li&#62;
+                          &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Aenean eu leo quam. Pellentesque ornare.&#60;/li&#62;
+                          &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Nullam quis risus eget urna mollis ornare.&#60;/li&#62;
+                          &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;Fusce dapibus, tellus ac cursus commodo.&#60;/li&#62;
                         &#60;/ul&#62;
-                        &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;Learn More&#60;/a&#62;
+                        &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;Learn More&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
@@ -3451,7 +3451,7 @@
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!sticky lg:!sticky !mt-[50px]" style="top: 8rem;">
             <h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !mb-5">The service I offer is specifically designed to meet your needs.</h3>
             <p class="!mb-7">Cras mattis consectetur purus sit amet fermentum. Donec ullamcorper nulla non metus auctor fringilla. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
-            <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end">More Details <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
+            <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end">More Details <i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"></i></a>
           </div>
           <!-- /column -->
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto !mt-[50px]">
@@ -3554,7 +3554,7 @@
                       &#60;div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!sticky lg:!sticky !mt-[50px]" style="top: 8rem;"&#62;
                         &#60;h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !mb-5"&#62;The service I offer is specifically designed to meet your needs.&#60;/h3&#62;
                         &#60;p class="!mb-7"&#62;Cras mattis consectetur purus sit amet fermentum. Donec ullamcorper nulla non metus auctor fringilla. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end"&#62;More Details &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end"&#62;More Details &#60;i class="uil uil-arrow-up-right !ml-[.3rem] before:content-['\e950']"&#62;&#60;/i&#62;&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                       &#60;div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto !mt-[50px]"&#62;
@@ -3673,9 +3673,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/footer.html b/public/docs/blocks/footer.html
index 86c7569..dd1996d 100644
--- a/public/docs/blocks/footer.html
+++ b/public/docs/blocks/footer.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -583,7 +583,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='facts.html'>Facts</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='faq.html'>FAQ</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='features.html'>Features</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='footer.html'>Footer</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='footer.html'>Footer</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='hero.html'>Hero</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='misc.html'>Misc</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='navbar.html'>Navbar</a></li>
@@ -622,7 +622,7 @@
                 <div class="widget !text-[#cacaca]">
                   <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
                   <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-                  <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                  <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
                 </div>
                 <!-- /.widget -->
               </div>
@@ -631,11 +631,11 @@
                 <div class="widget !text-[#cacaca]">
                   <h4 class="widget-title !text-white !mb-3">Learn More</h4>
                   <ul class="pl-0 list-none   !mb-0">
-                    <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+                    <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
@@ -653,7 +653,7 @@
                           <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                             <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL">
                             <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL">Email Address</label>
-                            <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none border-0">
+                            <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none border-0">
                           </div>
                           <div id="mce-responses" class="clear">
                             <div class="response" id="mce-error-response" style="display:none"></div>
@@ -712,7 +712,7 @@
                             &#60;div class="widget !text-[#cacaca]"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Get in Touch&#60;/h4&#62;
                               &#60;address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4"&#62;ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP&#60;/address&#62;
-                              &#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
+                              &#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
                           &#60;/div&#62;
@@ -721,11 +721,11 @@
                             &#60;div class="widget !text-[#cacaca]"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Learn More&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none   !mb-0"&#62;
-                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Terms of Use&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Privacy Policy&#60;/a&#62;&#60;/li&#62;
+                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Terms of Use&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Privacy Policy&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
@@ -743,7 +743,7 @@
                                       &#60;div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full"&#62;
                                         &#60;input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL"&#62;
                                         &#60;label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL"&#62;Email Address&#60;/label&#62;
-                                        &#60;input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none border-0"&#62;
+                                        &#60;input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none border-0"&#62;
                                       &#60;/div&#62;
                                       &#60;div id="mce-responses" class="clear"&#62;
                                         &#60;div class="response" id="mce-error-response" style="display:none"&#62;&#60;/div&#62;
@@ -1010,10 +1010,10 @@
                 <div class="widget">
                   <h4 class="widget-title !text-white !mb-3">Need Help?</h4>
                   <ul class="pl-0 list-none text-inherit  !mb-0">
-        <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Support</a></li>
-        <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Get Started</a></li>
-        <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-        <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+        <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Support</a></li>
+        <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Get Started</a></li>
+        <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+        <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
@@ -1023,11 +1023,11 @@
                 <div class="widget">
                   <h4 class="widget-title !text-white !mb-3">Learn More</h4>
                   <ul class="pl-0 list-none   !mb-0">
-                <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Pricing</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Features</a></li>
+                <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Pricing</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Features</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
@@ -1037,7 +1037,7 @@
                 <div class="widget">
                   <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
                   <address class=" not-italic !leading-[inherit] !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-                  <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                  <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
                 </div>
                 <!-- /.widget -->
               </div>
@@ -1089,10 +1089,10 @@
                             &#60;div class="widget"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Need Help?&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none text-inherit  !mb-0"&#62;
-                    &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Support&#60;/a&#62;&#60;/li&#62;
-                    &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Get Started&#60;/a&#62;&#60;/li&#62;
-                    &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Terms of Use&#60;/a&#62;&#60;/li&#62;
-                    &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Privacy Policy&#60;/a&#62;&#60;/li&#62;
+                    &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Support&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Get Started&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Terms of Use&#60;/a&#62;&#60;/li&#62;
+                    &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Privacy Policy&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
@@ -1102,11 +1102,11 @@
                             &#60;div class="widget"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Learn More&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none   !mb-0"&#62;
-                            &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
-                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
-                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
-                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Pricing&#60;/a&#62;&#60;/li&#62;
-                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Features&#60;/a&#62;&#60;/li&#62;
+                            &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
+                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
+                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
+                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Pricing&#60;/a&#62;&#60;/li&#62;
+                            &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Features&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
@@ -1116,7 +1116,7 @@
                             &#60;div class="widget"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Get in Touch&#60;/h4&#62;
                               &#60;address class=" not-italic !leading-[inherit] !mb-4"&#62;ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP&#60;/address&#62;
-                              &#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
+                              &#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
                           &#60;/div&#62;
@@ -1191,7 +1191,7 @@
                 <div class="widget">
                   <div class="flex flex-row">
                     <div>
-                      <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                      <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                     </div>
                     <div>
                       <h5 class="!mb-1">Phone</h5>
@@ -1207,7 +1207,7 @@
                 <div class="widget">
                   <div class="flex flex-row">
                     <div>
-                      <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                      <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                     </div>
                     <div class="!self-start !justify-start">
                       <h5 class="!mb-1">Address</h5>
@@ -1264,7 +1264,7 @@
                             &#60;div class="widget"&#62;
                               &#60;div class="flex flex-row"&#62;
                                 &#60;div&#62;
-                                  &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                  &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-phone-volume before:content-['\ec50']"&#62;&#60;/i&#62; &#60;/div&#62;
                                 &#60;/div&#62;
                                 &#60;div&#62;
                                   &#60;h5 class="!mb-1"&#62;Phone&#60;/h5&#62;
@@ -1280,7 +1280,7 @@
                             &#60;div class="widget"&#62;
                               &#60;div class="flex flex-row"&#62;
                                 &#60;div&#62;
-                                  &#60;div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
+                                  &#60;div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"&#62; &#60;i class="uil uil-location-pin-alt before:content-['\ebd8']"&#62;&#60;/i&#62; &#60;/div&#62;
                                 &#60;/div&#62;
                                 &#60;div class="!self-start !justify-start"&#62;
                                   &#60;h5 class="!mb-1"&#62;Address&#60;/h5&#62;
@@ -1348,7 +1348,7 @@
           <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
             <div class="xl:!flex lg:!flex flex-row xl:!items-center lg:!items-center">
               <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6 xl:!mb-0 lg:!mb-0 lg:!pr-40 xl:!pr-60 xxl:!pr-[22.5rem] !text-white">Join our community by using our services and grow your business.</h3>
-              <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]  !mb-0 whitespace-nowrap">Try It For Free</a>
+              <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]  !mb-0 whitespace-nowrap">Try It For Free</a>
             </div>
             <!--/div -->
             <hr class="!mt-[3rem] !mb-[3.5rem] opacity-100 m-[4.5rem_0] border-t border-solid border-[rgba(164,174,198,.2)]">
@@ -1373,7 +1373,7 @@
                 <div class="widget !text-[#cacaca]">
                   <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
                   <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-                  <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                  <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
                 </div>
                 <!-- /.widget -->
               </div>
@@ -1382,11 +1382,11 @@
                 <div class="widget !text-[#cacaca]">
                   <h4 class="widget-title !text-white !mb-3">Learn More</h4>
                   <ul class="pl-0 list-none   !mb-0">
-                    <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+                    <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
@@ -1404,7 +1404,7 @@
                           <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                             <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                             <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                            <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                            <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                           </div>
                           <div id="mce-responses2" class="clear">
                             <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1444,7 +1444,7 @@
                       &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                         &#60;div class="xl:!flex lg:!flex flex-row xl:!items-center lg:!items-center"&#62;
                           &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6 xl:!mb-0 lg:!mb-0 lg:!pr-40 xl:!pr-60 xxl:!pr-[22.5rem] !text-white"&#62;Join our community by using our services and grow your business.&#60;/h3&#62;
-                          &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]  !mb-0 whitespace-nowrap"&#62;Try It For Free&#60;/a&#62;
+                          &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]  !mb-0 whitespace-nowrap"&#62;Try It For Free&#60;/a&#62;
                         &#60;/div&#62;
                         &#60;!--/div --&#62;
                         &#60;hr class="!mt-[3rem] !mb-[3.5rem] opacity-100 m-[4.5rem_0] border-t border-solid border-[rgba(164,174,198,.2)]"&#62;
@@ -1469,7 +1469,7 @@
                             &#60;div class="widget !text-[#cacaca]"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Get in Touch&#60;/h4&#62;
                               &#60;address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4"&#62;ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP&#60;/address&#62;
-                              &#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
+                              &#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
                           &#60;/div&#62;
@@ -1478,11 +1478,11 @@
                             &#60;div class="widget !text-[#cacaca]"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Learn More&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none   !mb-0"&#62;
-                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Terms of Use&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Privacy Policy&#60;/a&#62;&#60;/li&#62;
+                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Terms of Use&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Privacy Policy&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
@@ -1500,7 +1500,7 @@
                                       &#60;div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full"&#62;
                                         &#60;input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2"&#62;
                                         &#60;label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2"&#62;Email Address&#60;/label&#62;
-                                        &#60;input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none border-0"&#62;
+                                        &#60;input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none border-0"&#62;
                                       &#60;/div&#62;
                                       &#60;div id="mce-responses2" class="clear"&#62;
                                         &#60;div class="response" id="mce-error-response2" style="display:none"&#62;&#60;/div&#62;
@@ -1542,7 +1542,7 @@
   &lt;div class=&quot;container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20&quot;&gt;
     &lt;div class=&quot;lg:!flex flex-row lg:!items-center&quot;&gt;
       &lt;h3 class=&quot;text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6 lg:!mb-0 xl:!pr-40 lg:!pr-40 xl:!pr-60 xxl:!pr-[22.5rem] !text-white&quot;&gt;Join our community by using our services and grow your business.&lt;/h3&gt;
-      &lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]  !mb-0 whitespace-nowrap&quot;&gt;Try It For Free&lt;/a&gt;
+      &lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]  !mb-0 whitespace-nowrap&quot;&gt;Try It For Free&lt;/a&gt;
     &lt;/div&gt;
     &lt;!--/div --&gt;
     &lt;hr class=&quot;mt-[3rem] !mb-14&quot; /&gt;
@@ -1655,7 +1655,7 @@
                   <li class="clear-both block overflow-hidden">
                     <figure class="float-left w-14 !h-[4.5rem] rounded-[0.4rem]"><a href='../../blog-post.html'><img class="rounded-[0.4rem]" src="../../assets/img/photos/a4.jpg" alt="image"></a></figure>
                     <div class="!relative !ml-[4.25rem] !mb-0">
-                      <h6 class="!mb-2"> <a class='!text-white hover:!text-[#3f78e0]' href='../../blog-post.html'>Magna Mollis Ultricies</a> </h6>
+                      <h6 class="!mb-2"> <a class='!text-white hover:!text-[#e31e24]' href='../../blog-post.html'>Magna Mollis Ultricies</a> </h6>
                       <ul class="!text-[0.7rem] !text-[#cacaca] m-0 p-0 list-none">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Mar 2022</span></li>
                       </ul>
@@ -1665,7 +1665,7 @@
                   <li class="!mt-5 clear-both block overflow-hidden">
                     <figure class="float-left w-14 !h-[4.5rem] rounded-[0.4rem]"> <a href='../../blog-post.html'><img class="rounded-[0.4rem]" src="../../assets/img/photos/a5.jpg" alt="image"></a></figure>
                     <div class="!relative !ml-[4.25rem] !mb-0">
-                      <h6 class="!mb-2"> <a class='!text-white hover:!text-[#3f78e0]' href='../../blog-post.html'>Ornare Nullam Risus</a> </h6>
+                      <h6 class="!mb-2"> <a class='!text-white hover:!text-[#e31e24]' href='../../blog-post.html'>Ornare Nullam Risus</a> </h6>
                       <ul class="!text-[0.7rem] !text-[#cacaca] m-0 p-0 list-none">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>16 Feb 2022</span></li>
                       </ul>
@@ -1675,7 +1675,7 @@
                   <li class="!mt-5 clear-both block overflow-hidden">
                     <figure class="float-left w-14 !h-[4.5rem] rounded-[0.4rem]"><a href='../../blog-post.html'><img class="rounded-[0.4rem]" src="../../assets/img/photos/a6.jpg" alt="image"></a></figure>
                     <div class="!relative !ml-[4.25rem] !mb-0">
-                      <h6 class="!mb-2"> <a class='!text-white hover:!text-[#3f78e0]' href='../../blog-post.html'>Euismod Nullam Fusce</a> </h6>
+                      <h6 class="!mb-2"> <a class='!text-white hover:!text-[#e31e24]' href='../../blog-post.html'>Euismod Nullam Fusce</a> </h6>
                       <ul class="!text-[0.7rem] !text-[#cacaca] m-0 p-0 list-none">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>8 Jan 2022</span></li>
                       </ul>
@@ -1700,9 +1700,9 @@
                 <div class="widget">
                   <h4 class="widget-title !text-white !mb-3">Categories</h4>
                   <ul class="pl-0 list-none text-inherit bullet-white ">
-                    <li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Lifestyle (21)</a></li>
-                    <li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Photography (19)</a></li>
-                    <li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Journal (16)</a></li>
+                    <li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Lifestyle (21)</a></li>
+                    <li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Photography (19)</a></li>
+                    <li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Journal (16)</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
@@ -1712,7 +1712,7 @@
                 <div class="widget">
                   <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
                   <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-                  <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                  <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
                 </div>
                 <!-- /.widget -->
                 <div class="widget !mt-[1rem]">
@@ -1733,18 +1733,18 @@
                 <div class="widget">
                   <h4 class="widget-title !text-white !mb-3">Learn More</h4>
                   <ul class="pl-0 list-none text-inherit  !mb-0">
-                    <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
+                    <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
                 <div class="widget !mt-[1rem]">
                   <h4 class="widget-title !text-white !mb-3">Need Help?</h4>
                   <ul class="pl-0 list-none text-inherit  !mb-0">
-                    <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Support</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Get Started</a></li>
-                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Contact Us</a></li>
+                    <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Support</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Get Started</a></li>
+                    <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Contact Us</a></li>
                   </ul>
                 </div>
                 <!-- /.widget -->
@@ -1778,7 +1778,7 @@
                               &#60;li class="clear-both block overflow-hidden"&#62;
                                 &#60;figure class="float-left w-14 !h-[4.5rem] rounded-[0.4rem]"&#62;&#60;a href="../../blog-post.html"&#62;&#60;img class="rounded-[0.4rem]" src="../../assets/img/photos/a4.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                                 &#60;div class="!relative !ml-[4.25rem] !mb-0"&#62;
-                                  &#60;h6 class="!mb-2"&#62; &#60;a class="!text-white hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Magna Mollis Ultricies&#60;/a&#62; &#60;/h6&#62;
+                                  &#60;h6 class="!mb-2"&#62; &#60;a class="!text-white hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Magna Mollis Ultricies&#60;/a&#62; &#60;/h6&#62;
                                   &#60;ul class="!text-[0.7rem] !text-[#cacaca] m-0 p-0 list-none"&#62;
                                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;26 Mar 2022&#60;/span&#62;&#60;/li&#62;
                                   &#60;/ul&#62;
@@ -1788,7 +1788,7 @@
                               &#60;li class="!mt-5 clear-both block overflow-hidden"&#62;
                                 &#60;figure class="float-left w-14 !h-[4.5rem] rounded-[0.4rem]"&#62; &#60;a href="../../blog-post.html"&#62;&#60;img class="rounded-[0.4rem]" src="../../assets/img/photos/a5.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                                 &#60;div class="!relative !ml-[4.25rem] !mb-0"&#62;
-                                  &#60;h6 class="!mb-2"&#62; &#60;a class="!text-white hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Ornare Nullam Risus&#60;/a&#62; &#60;/h6&#62;
+                                  &#60;h6 class="!mb-2"&#62; &#60;a class="!text-white hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Ornare Nullam Risus&#60;/a&#62; &#60;/h6&#62;
                                   &#60;ul class="!text-[0.7rem] !text-[#cacaca] m-0 p-0 list-none"&#62;
                                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;16 Feb 2022&#60;/span&#62;&#60;/li&#62;
                                   &#60;/ul&#62;
@@ -1798,7 +1798,7 @@
                               &#60;li class="!mt-5 clear-both block overflow-hidden"&#62;
                                 &#60;figure class="float-left w-14 !h-[4.5rem] rounded-[0.4rem]"&#62;&#60;a href="../../blog-post.html"&#62;&#60;img class="rounded-[0.4rem]" src="../../assets/img/photos/a6.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                                 &#60;div class="!relative !ml-[4.25rem] !mb-0"&#62;
-                                  &#60;h6 class="!mb-2"&#62; &#60;a class="!text-white hover:!text-[#3f78e0]" href="../../blog-post.html"&#62;Euismod Nullam Fusce&#60;/a&#62; &#60;/h6&#62;
+                                  &#60;h6 class="!mb-2"&#62; &#60;a class="!text-white hover:!text-[#e31e24]" href="../../blog-post.html"&#62;Euismod Nullam Fusce&#60;/a&#62; &#60;/h6&#62;
                                   &#60;ul class="!text-[0.7rem] !text-[#cacaca] m-0 p-0 list-none"&#62;
                                     &#60;li class="post-date inline-block"&#62;&#60;i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"&#62;&#60;/i&#62;&#60;span&#62;8 Jan 2022&#60;/span&#62;&#60;/li&#62;
                                   &#60;/ul&#62;
@@ -1823,9 +1823,9 @@
                             &#60;div class="widget"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Categories&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none text-inherit bullet-white "&#62;
-                                &#60;li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Lifestyle (21)&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Photography (19)&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Journal (16)&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Lifestyle (21)&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Photography (19)&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem] relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:text-white before:font-SansSerif"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Journal (16)&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
@@ -1835,7 +1835,7 @@
                             &#60;div class="widget"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Get in Touch&#60;/h4&#62;
                               &#60;address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4"&#62;ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP&#60;/address&#62;
-                              &#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
+                              &#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com"&#62;info@truncgil.com&#60;/a&#62;&#60;br&#62; 00 (123) 456 78 90
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
                             &#60;div class="widget !mt-[1rem]"&#62;
@@ -1856,18 +1856,18 @@
                             &#60;div class="widget"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Learn More&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none text-inherit  !mb-0"&#62;
-                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
+                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;About Us&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Our Story&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Projects&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
                             &#60;div class="widget !mt-[1rem]"&#62;
                               &#60;h4 class="widget-title !text-white !mb-3"&#62;Need Help?&#60;/h4&#62;
                               &#60;ul class="pl-0 list-none text-inherit  !mb-0"&#62;
-                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Support&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Get Started&#60;/a&#62;&#60;/li&#62;
-                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#"&#62;Contact Us&#60;/a&#62;&#60;/li&#62;
+                                &#60;li&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Support&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Get Started&#60;/a&#62;&#60;/li&#62;
+                                &#60;li class="!mt-[0.35rem]"&#62;&#60;a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#"&#62;Contact Us&#60;/a&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                             &#60;/div&#62;
                             &#60;!-- /.widget --&#62;
@@ -1932,9 +1932,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/hero.html b/public/docs/blocks/hero.html
index c96f4aa..d79111b 100644
--- a/public/docs/blocks/hero.html
+++ b/public/docs/blocks/hero.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -584,7 +584,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='faq.html'>FAQ</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='features.html'>Features</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='footer.html'>Footer</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='hero.html'>Hero</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='hero.html'>Hero</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='misc.html'>Misc</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='navbar.html'>Navbar</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='portfolio.html'>Portfolio</a></li>
@@ -641,7 +641,7 @@
       &lt;div class=&quot;md:w-10/12 flex-[0_0_auto] !px-[15px] max-w-full md:!ml-[8.33333333%] lg:!ml-0 lg:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full text-center lg:text-left xl:text-left&quot;&gt;
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5 md:mx-[-1.25rem] lg:mx-0&quot;&gt;Grow Your Business with Our Solutions.&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1rem] !mb-7&quot;&gt;We help our clients to increase their website traffic, rankings and visibility in search results.&lt;/p&gt;
-        &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;Try It For Free&lt;/a&gt;&lt;/span&gt;
+        &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;Try It For Free&lt;/a&gt;&lt;/span&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
     &lt;/div&gt;
@@ -699,7 +699,7 @@
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5&quot;&gt;We bring solutions to make life easier for our customers.&lt;/h1&gt;
         &lt;p class=&quot;lead text-[20px] leading-normal !mb-7 md:!px-10 lg:!px-0&quot;&gt;We have considered our solutions to support every stage of your growth.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-outline-primary !rounded-[50rem]&quot;&gt;Free Trial&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -748,16 +748,16 @@
   &lt;div class=&quot;container pt-7 xl:pt-12 lg:pt-12 md:pt-12 pb-8&quot;&gt;
     &lt;div class=&quot;row mx-0 !mt-[-50px] items-center&quot;&gt;
       &lt;div class=&quot;lg:w-6/12 flex-[0_0_auto] !px-[15px] max-w-full&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title&quot; data-delay=&quot;600&quot;&gt;
-        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !text-white !mb-4&quot;&gt;Trunçgil focuses on &lt;br /&gt;&lt;span class=&quot;typer !text-[#3f78e0]  whitespace-nowrap&quot; data-delay=&quot;100&quot; data-words=&quot;customer satisfaction,business needs,creative ideas&quot;&gt;&lt;/span&gt;&lt;span class=&quot;cursor !text-[#3f78e0] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;&lt;/h1&gt;
+        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !text-white !mb-4&quot;&gt;Trunçgil focuses on &lt;br /&gt;&lt;span class=&quot;typer !text-[#e31e24]  whitespace-nowrap&quot; data-delay=&quot;100&quot; data-words=&quot;customer satisfaction,business needs,creative ideas&quot;&gt;&lt;/span&gt;&lt;span class=&quot;cursor !text-[#e31e24] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1.2rem] leading-normal !text-white !mb-7 md:!pr-32 xl:!pr-0 lg:!pr-0 xxl:!pr-20&quot;&gt;We carefully consider our solutions to support each and every stage of your growth.&lt;/p&gt;
         &lt;div&gt;
-          &lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded&quot;&gt;Get Started&lt;/a&gt;
+          &lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded&quot;&gt;Get Started&lt;/a&gt;
         &lt;/div&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
       &lt;div class=&quot;lg:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full lg:!ml-[8.33333333%] !mb-[-8rem]&quot; data-cues=&quot;slideInDown&quot;&gt;
         &lt;div class=&quot;relative&quot;&gt;
-          &lt;a href=&quot;./assets/media/movie.mp4&quot; class=&quot;btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mx-auto !mb-6 absolute&quot; style=&quot;top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;&quot; data-glightbox&gt;&lt;i class=&quot;icn-caret-right&quot;&gt;&lt;/i&gt;&lt;/a&gt;
+          &lt;a href=&quot;./assets/media/movie.mp4&quot; class=&quot;btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mx-auto !mb-6 absolute&quot; style=&quot;top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;&quot; data-glightbox&gt;&lt;i class=&quot;icn-caret-right&quot;&gt;&lt;/i&gt;&lt;/a&gt;
           &lt;figure class=&quot;rounded !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]&quot;&gt;&lt;img src=&quot;./assets/img/photos/about13.jpg&quot; srcset=&quot;./assets/img/photos/about13@2x.jpg 2x&quot; alt=&quot;&quot;&gt;&lt;/figure&gt;
         &lt;/div&gt;
         &lt;!-- /div --&gt;
@@ -816,7 +816,7 @@
           &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5&quot;&gt;Just sit &amp; relax while we take care of your business needs.&lt;/h1&gt;
           &lt;p class=&quot;lead text-[20px] leading-normal !mb-7 md:!pr-10&quot;&gt;We make your spending stress-free for you to have the perfect control.&lt;/p&gt;
           &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-            &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
+            &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
             &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-outline-primary !rounded-[50rem]&quot;&gt;Contact Us&lt;/a&gt;&lt;/span&gt;
           &lt;/div&gt;
         &lt;/div&gt;
@@ -872,7 +872,7 @@
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-4&quot;&gt;Staying on top of your bills never been this easy&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1rem] xl:!px-14 xxl:!px-6 !mb-7&quot;&gt;Easily achieve your saving goals. Have all your recurring and one time expenses and incomes in one place.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;600&quot;&gt;
-          &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded mx-1&quot;&gt;Get Started&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded mx-1&quot;&gt;Get Started&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a class=&quot;btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  rounded mx-1&quot;&gt;Free Trial&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -943,7 +943,7 @@
         &lt;h1 class=&quot;text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.2] xl:!text-[2.2rem] !mb-4 sm:mx-[-0.5rem] md:mx-0&quot;&gt;Get all of your steps, exercise, sleep and meds in one place.&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1rem] !mb-7 md:!px-10 lg:!px-0&quot;&gt;Trunçgil is now available to download from both the App Store and Google Play Store.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded me-2&quot;&gt;&lt;i class=&quot;uil uil-apple&quot;&gt;&lt;/i&gt; App Store&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded me-2&quot;&gt;&lt;i class=&quot;uil uil-apple&quot;&gt;&lt;/i&gt; App Store&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a class=&quot;btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  btn-icon btn-icon-start rounded&quot;&gt;&lt;i class=&quot;uil uil-google-play&quot;&gt;&lt;/i&gt; Google Play&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -1001,7 +1001,7 @@
     &lt;/div&gt;
     &lt;!-- /.row --&gt;
     &lt;div class=&quot;flex justify-center&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;join&quot; data-delay=&quot;900&quot;&gt;
-      &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1&quot;&gt;See Projects&lt;/a&gt;&lt;/span&gt;
+      &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1&quot;&gt;See Projects&lt;/a&gt;&lt;/span&gt;
       &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-outline-primary !rounded-[50rem] mx-1&quot;&gt;Contact Us&lt;/a&gt;&lt;/span&gt;
     &lt;/div&gt;
     &lt;!-- /div --&gt;
@@ -1083,7 +1083,7 @@
             &lt;h1 class=&quot;text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.2] xl:!text-[2.2rem] !mb-5&quot;&gt;Crafting project specific solutions with expertise.&lt;/h1&gt;
             &lt;p class=&quot;lead text-[1rem] leading-normal !mb-7 xl:!pr-10&quot;&gt;We&apos;re a company that focuses on establishing long-term relationships with customers.&lt;/p&gt;
             &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-              &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
+              &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
               &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-outline-primary !rounded-[50rem]&quot;&gt;Contact Us&lt;/a&gt;&lt;/span&gt;
             &lt;/div&gt;
           &lt;/div&gt;
@@ -1138,10 +1138,10 @@
   &lt;div class=&quot;container pt-10 pb-14 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] xl:pb-28 lg:pb-28 md:pb-28&quot;&gt;
     &lt;div class=&quot;row xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center&quot;&gt;
       &lt;div class=&quot;md:w-10/12 flex-[0_0_auto] !px-[15px] max-w-full md:!ml-[8.33333333%] lg:!ml-0 lg:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full lg:!mt-[-.5rem] xl:!mt-[-.5rem] text-center lg:text-left xl:text-left order-2 lg:!order-none&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title&quot; data-delay=&quot;600&quot;&gt;
-        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5 md:mx-10 lg:mx-0&quot;&gt;Trunçgil is effortless and powerful with &lt;br /&gt;&lt;span class=&quot;typer !text-[#3f78e0]  whitespace-nowrap&quot; data-delay=&quot;100&quot; data-words=&quot;easy usage,fast transactions,secure payments&quot;&gt;&lt;/span&gt;&lt;span class=&quot;cursor !text-[#3f78e0] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;&lt;/h1&gt;
+        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5 md:mx-10 lg:mx-0&quot;&gt;Trunçgil is effortless and powerful with &lt;br /&gt;&lt;span class=&quot;typer !text-[#e31e24]  whitespace-nowrap&quot; data-delay=&quot;100&quot; data-words=&quot;easy usage,fast transactions,secure payments&quot;&gt;&lt;/span&gt;&lt;span class=&quot;cursor !text-[#e31e24] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1rem] !mb-7&quot;&gt;Achieve your saving goals. Have all your recurring and one time expenses and incomes in one place.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded me-2&quot;&gt;Get Started&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded me-2&quot;&gt;Get Started&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  rounded&quot;&gt;Free Trial&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -1216,7 +1216,7 @@
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[3rem] !text-[calc(1.425rem_+_2.1vw)] !mb-4 md:!px-20 lg:!px-0&quot;&gt;We bring solutions to make life easier.&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1.2rem] leading-normal !mb-7 md:mx-16 lg:mx-10&quot;&gt;We are a creative company that focuses on long term relationships with customers.&lt;/p&gt;
         &lt;div&gt;
-          &lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded !mb-5&quot;&gt;Read More&lt;/a&gt;
+          &lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mb-5&quot;&gt;Read More&lt;/a&gt;
         &lt;/div&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
@@ -1345,7 +1345,7 @@
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5 md:mx-[-1.25rem] lg:mx-0&quot;&gt;Creative. Smart. Awesome.&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1rem] !mb-7&quot;&gt;We specialize in web, mobile and identity design. We love to turn ideas into beautiful things.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded me-2&quot;&gt;See Projects&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded me-2&quot;&gt;See Projects&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a class=&quot;btn btn-yellow !text-white !bg-[#fab758] border-[#fab758] hover:text-white hover:bg-[#fab758] hover:!border-[#fab758]   active:text-white active:bg-[#fab758] active:border-[#fab758] disabled:text-white disabled:bg-[#fab758] disabled:border-[#fab758] rounded&quot;&gt;Learn More&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -1405,7 +1405,7 @@
       &lt;div class=&quot;md:w-6/12 flex-[0_0_auto] !px-[15px] max-w-full xl:w-3/12 flex-[0_0_auto] !px-[15px] max-w-full&quot;&gt;
         &lt;div class=&quot;card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]&quot;&gt;
           &lt;div class=&quot;card-body&quot;&gt;
-            &lt;img src=&quot;./assets/img/icons/lineal/gift.svg&quot; class=&quot;svg-inject icon-svg icon-svg-md !text-[#3f78e0] !mb-3&quot; alt=&quot;&quot; /&gt;
+            &lt;img src=&quot;./assets/img/icons/lineal/gift.svg&quot; class=&quot;svg-inject icon-svg icon-svg-md !text-[#e31e24] !mb-3&quot; alt=&quot;&quot; /&gt;
             &lt;h4&gt;Product Design&lt;/h4&gt;
             &lt;p class=&quot;mb-2&quot;&gt;Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.&lt;/p&gt;
             &lt;a href=&quot;#&quot; class=&quot;more hover link-blue&quot;&gt;Learn More&lt;/a&gt;
@@ -1713,7 +1713,7 @@
           &lt;div class=&quot;card-body py-4 px-5&quot;&gt;
             &lt;div class=&quot;flex flex-row items-center&quot;&gt;
               &lt;div&gt;
-                &lt;img src=&quot;./assets/img/icons/lineal/check.svg&quot; class=&quot;svg-inject icon-svg icon-svg-sm !text-[#3f78e0]  !mx-auto !mr-3&quot; alt=&quot;&quot; /&gt;
+                &lt;img src=&quot;./assets/img/icons/lineal/check.svg&quot; class=&quot;svg-inject icon-svg icon-svg-sm !text-[#e31e24]  !mx-auto !mr-3&quot; alt=&quot;&quot; /&gt;
               &lt;/div&gt;
               &lt;div&gt;
                 &lt;h3 class=&quot;counter  !mb-0 whitespace-nowrap&quot;&gt;250+&lt;/h3&gt;
@@ -1730,7 +1730,7 @@
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5&quot;&gt;I&apos;m User Interface Designer &amp; Developer.&lt;/h1&gt;
         &lt;p class=&quot;lead text-[20px] leading-normal !mb-7 md:!px-10 lg:!px-0&quot;&gt;Hello! I&apos;m Julia, a freelance user interface designer &amp; developer based in London. I&rsquo;m very passionate about the work that I do.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center lg:!justify-start&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;See My Works&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;See My Works&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-outline-primary !rounded-[50rem]&quot;&gt;Contact Me&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -1784,7 +1784,7 @@
         &lt;h2 class=&quot;text-[0.8rem] uppercase !tracking-[0.05rem] !text-[#343f52] !mb-4&quot;&gt;Hello! This is Trunçgil&lt;/h2&gt;
         &lt;h1 class=&quot;xl:!text-[2.9rem] !text-[calc(1.415rem_+_1.98vw)] !leading-[1.2] font-bold !mb-7&quot;&gt;We bring rapid solutions for your business.&lt;/h1&gt;
         &lt;div class=&quot;flex justify-center&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-outline-primary !rounded-[50rem]&quot;&gt;Contact Us&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
@@ -2076,9 +2076,9 @@
       &lt;/div&gt;
       &lt;!-- /column --&gt;
       &lt;div class=&quot;md:w-10/12 flex-[0_0_auto] !px-[15px] max-w-full md:!ml-[8.33333333%] lg:!ml-0 lg:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full text-center lg:text-left xl:text-left&quot;&gt;
-        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[2.7rem] !text-[calc(1.395rem_+_1.74vw)] !mb-5 md:mx-[-1.25rem] lg:mx-0 !mt-7&quot;&gt;A digital agency &lt;br class=&quot;md:!hidden&quot;&gt;specializing on &lt;br class=&quot;md:!hidden&quot;&gt;&lt;span class=&quot;rotator-fade !text-[#3f78e0] &quot;&gt;mobile design,web design,3D animation&lt;/span&gt;&lt;/h1&gt;
+        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[2.7rem] !text-[calc(1.395rem_+_1.74vw)] !mb-5 md:mx-[-1.25rem] lg:mx-0 !mt-7&quot;&gt;A digital agency &lt;br class=&quot;md:!hidden&quot;&gt;specializing on &lt;br class=&quot;md:!hidden&quot;&gt;&lt;span class=&quot;rotator-fade !text-[#e31e24] &quot;&gt;mobile design,web design,3D animation&lt;/span&gt;&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1rem] !mb-7&quot;&gt;We are an award winning design agency that strongly believes in the power of creative ideas.&lt;/p&gt;
-        &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] me-2&quot;&gt;Get Started&lt;/a&gt;&lt;/span&gt;
+        &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] me-2&quot;&gt;Get Started&lt;/a&gt;&lt;/span&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
     &lt;/div&gt;
@@ -2535,7 +2535,7 @@
     &lt;div class=&quot;container pt-10 xl:pt-14 lg:pt-14 xl:!pt-14 xxl:!pt-10 xl:pb-10 lg:pb-10 xl:pb-10 xxl:pb-0&quot;&gt;
       &lt;div class=&quot;row md:mx-[-20px] xl:mx-[-35px] !mt-[-50px] items-center text-center lg:text-left xl:text-left&quot;&gt;
         &lt;div class=&quot;lg:w-6/12 flex-[0_0_auto] !px-[15px] max-w-full&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title&quot; data-delay=&quot;900&quot;&gt;
-          &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-4 xl:!mr-5 xl:!mt-[-2.5rem] lg:!mt-[-2.5rem]&quot;&gt;Grow Your Business with &lt;br class=&quot;d-none md:block xl:!hidden lg:!hidden&quot; /&gt;&lt;span class=&quot;text-[#3f78e0] &quot;&gt;Our Marketing Solutions&lt;/span&gt;&lt;/h1&gt;
+          &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-4 xl:!mr-5 xl:!mt-[-2.5rem] lg:!mt-[-2.5rem]&quot;&gt;Grow Your Business with &lt;br class=&quot;d-none md:block xl:!hidden lg:!hidden&quot; /&gt;&lt;span class=&quot;text-[#e31e24] &quot;&gt;Our Marketing Solutions&lt;/span&gt;&lt;/h1&gt;
           &lt;p class=&quot;lead text-[1.2rem] leading-normal !mb-7 xxl:!pr-20&quot;&gt;We help our clients to increase their website &lt;br class=&quot;d-none md:block xl:!hidden lg:!hidden&quot; /&gt; traffic, rankings and visibility in search results.&lt;/p&gt;
           &lt;div class=&quot;inline-flex me-2&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-grape !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded&quot;&gt;Try it for Free&lt;/a&gt;&lt;/div&gt;
           &lt;div class=&quot;inline-flex&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-outline-grape !text-[#e31e24] bg-[#e31e24] !border-[#e31e24] !border-[2px] hover:!text-white hover:bg-[#e31e24] hover:!border-[#e31e24] focus:shadow-[rgba(96,93,186,1)] active:!text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:!text-white disabled:bg-transparent disabled:border-[#e31e24] rounded&quot;&gt;Explore Now&lt;/a&gt;&lt;/div&gt;
@@ -2596,7 +2596,7 @@
         &lt;div class=&quot;sm:w-6/12 flex-[0_0_auto] !px-[15px] max-w-full xxl:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full max-sm:!text-center text-left&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title&quot; data-interval=&quot;-200&quot; data-delay=&quot;500&quot;&gt;
           &lt;h2 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.8rem] !text-[calc(1.405rem_+_1.86vw)] !mb-4 !mt-0 lg:!mt-5 !tracking-[-0.035em] xl:!pr-5 xxl:!pr-0&quot;&gt;We bring solutions to make life &lt;span class=&quot; !relative z-[1] after:content-[''] after:absolute after:z-[-1] after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:w-[110%] after:h-[0.3em] after:-translate-x-2/4 after:left-2/4  style-3 yellow&quot;&gt;easier&lt;/span&gt;&lt;/h2&gt;
           &lt;p class=&quot;lead text-[1.15rem] leading-normal !mb-7 xl:!pr-5 lg:!pr-5 xl:!pr-5 xxl:!pr-0&quot;&gt;We are a creative company that focuses on long term relationships with customers.&lt;/p&gt;
-          &lt;div&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded&quot;&gt;Read More&lt;/a&gt;&lt;/div&gt;
+          &lt;div&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded&quot;&gt;Read More&lt;/a&gt;&lt;/div&gt;
         &lt;/div&gt;
         &lt;!--/column --&gt;
       &lt;/div&gt;
@@ -2789,11 +2789,11 @@
         &lt;div class=&quot;absolute shape fuchsia w-6 hidden  lg:block&quot; style=&quot;top: 0%; right: -25%; transform: rotate(70deg);&quot; data-cue=&quot;fadeIn&quot; data-delay=&quot;1500&quot;&gt;&lt;img src=&quot;./assets/img/svg/tri.svg&quot; class=&quot;svg-inject icon-svg w-full !h-full&quot; alt=&quot;&quot; /&gt;&lt;/div&gt;
         &lt;div class=&quot;absolute shape yellow w-6 hidden  lg:block&quot; style=&quot;bottom: 25%; right: -17%;&quot; data-cue=&quot;fadeIn&quot; data-delay=&quot;1500&quot;&gt;&lt;img src=&quot;./assets/img/svg/circle.svg&quot; class=&quot;svg-inject icon-svg w-full !h-full&quot; alt=&quot;&quot; /&gt;&lt;/div&gt;
         &lt;div data-cues=&quot;slideInDown&quot; data-group=&quot;page-title&quot;&gt;
-          &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] !mb-5 md:mx-10 lg:mx-0&quot;&gt;We are a digital web agency specializing on &lt;br /&gt;&lt;span class=&quot;rotator-fade !text-[#3f78e0] &quot;&gt;web design.,SEO services.,e-commerce.,Google Adwords.&lt;/span&gt;&lt;/h1&gt;
+          &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] !mb-5 md:mx-10 lg:mx-0&quot;&gt;We are a digital web agency specializing on &lt;br /&gt;&lt;span class=&quot;rotator-fade !text-[#e31e24] &quot;&gt;web design.,SEO services.,e-commerce.,Google Adwords.&lt;/span&gt;&lt;/h1&gt;
           &lt;p class=&quot;lead text-[1.2rem] !mb-8&quot;&gt;We are an award winning digital web agency that strongly believes in the power of creative ideas.&lt;/p&gt;
         &lt;/div&gt;
         &lt;div class=&quot;flex justify-center&quot; data-cues=&quot;slideInDown&quot; data-delay=&quot;600&quot;&gt;
-          &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[0.8rem] mx-1&quot;&gt;See Projects&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[0.8rem] mx-1&quot;&gt;See Projects&lt;/a&gt;&lt;/span&gt;
           &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-fuchsia !text-white !bg-[#e668b3] border-[#e668b3] hover:text-white hover:bg-[#e668b3] hover:!border-[#e668b3]   active:text-white active:bg-[#e668b3] active:border-[#e668b3] disabled:text-white disabled:bg-[#e668b3] disabled:border-[#e668b3] !rounded-[0.8rem] mx-1&quot;&gt;Contact Us&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
         &lt;!-- /div --&gt;
@@ -2850,7 +2850,7 @@
         &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !tracking-[-0.03em] xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] !mb-4 md:!px-8 lg:!px-0&quot;&gt;We bring rapid solutions for your &lt;span class=&quot; !relative z-[1] after:content-[''] after:absolute after:z-[-1] after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:w-[110%] after:h-[0.3em] after:-translate-x-2/4 after:left-2/4  style-1 primary&quot;&gt;&lt;em&gt;business&lt;/em&gt;&lt;/span&gt;&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1.2rem] leading-normal !mb-7&quot;&gt;We are creative company that values quality and focuses on establishing long-term relationships with customers.&lt;/p&gt;
         &lt;div&gt;
-          &lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded !mb-10 xxl:!mb-5&quot;&gt;See Projects&lt;/a&gt;
+          &lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mb-10 xxl:!mb-5&quot;&gt;See Projects&lt;/a&gt;
         &lt;/div&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
@@ -2915,7 +2915,7 @@
     &lt;div class=&quot;row&quot;&gt;
       &lt;div class=&quot;lg:w-10/12 flex-[0_0_auto] !px-[15px] max-w-full xl:w-9/12 flex-[0_0_auto] !px-[15px] max-w-full xxl:w-8/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto&quot; data-cues=&quot;zoomIn&quot; data-group=&quot;page-title&quot; data-interval=&quot;-200&quot; data-delay=&quot;500&quot;&gt;
         &lt;h2 class=&quot;h6 uppercase !tracking-[0.05rem] !text-white !mb-5&quot;&gt;Hello! We are Trunçgil&lt;/h2&gt;
-        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[3.4rem] !text-[calc(1.465rem_+_2.58vw)] !leading-[1.05] !mb-8 !text-white&quot;&gt;We have considered our solutions to &lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-6&quot;&gt;&lt;em&gt;assist&lt;/em&gt;&lt;/span&gt; every stage of your growth.&lt;/h1&gt;
+        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[3.4rem] !text-[calc(1.465rem_+_2.58vw)] !leading-[1.05] !mb-8 !text-white&quot;&gt;We have considered our solutions to &lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-6&quot;&gt;&lt;em&gt;assist&lt;/em&gt;&lt;/span&gt; every stage of your growth.&lt;/h1&gt;
         &lt;div class=&quot;flex justify-center !mb-4&quot; data-cues=&quot;zoomIn&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
           &lt;span&gt;&lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-white&quot;&gt;Explore Now&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
@@ -2976,7 +2976,7 @@
         &lt;div class=&quot;lg:w-9/12 flex-[0_0_auto] !px-[15px] max-w-full xxl:w-8/12 flex-[0_0_auto] !px-[15px] max-w-full !mx-auto&quot;&gt;
           &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] md:!px-10 lg:!px-0 xl:!px-8 !mb-5&quot;&gt;👋 Hello! I&apos;m &lt;img class=&quot;inline w-12 mx-1&quot; src=&quot;./assets/img/avatars/avatar.png&quot; alt=&quot;&quot;&gt; Camille, a product designer.&lt;/h1&gt;
           &lt;p class=&quot;lead text-[1.2rem] md:!px-10 lg:!px-0 lg:mx-[-2.5rem] xl:mx-0 !mb-8&quot;&gt;I&rsquo;m very passionate about the work that I do, and if you are curious you can find my works on &lt;a href=&quot;#&quot; class=&quot;hover&quot;&gt;Dribbble&lt;/a&gt;, my portfolio on &lt;a href=&quot;#&quot; class=&quot;hover&quot;&gt;Behance&lt;/a&gt;.&lt;/p&gt;
-          &lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end&quot;&gt;See My Works &lt;i class=&quot;uil uil-arrow-up-right&quot;&gt;&lt;/i&gt;&lt;/a&gt;
+          &lt;a href=&quot;#&quot; class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end&quot;&gt;See My Works &lt;i class=&quot;uil uil-arrow-up-right&quot;&gt;&lt;/i&gt;&lt;/a&gt;
         &lt;/div&gt;
         &lt;!-- /column --&gt;
       &lt;/div&gt;
@@ -3029,10 +3029,10 @@
   &lt;div class=&quot;container pt-10 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem]&quot;&gt;
     &lt;div class=&quot;row mx-[-5px] !mt-[-50px] items-center&quot;&gt;
       &lt;div class=&quot;md:w-10/12 flex-[0_0_auto] !px-[15px] max-w-full md:!ml-[8.33333333%] lg:!ml-0 lg:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full text-center lg:text-left xl:text-left order-2 lg:!order-none&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title&quot; data-delay=&quot;600&quot;&gt;
-        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5 md:mx-10 lg:mx-0&quot;&gt;Create a powerful but effortless website for &lt;br /&gt;&lt;span class=&quot;typer !text-[#3f78e0]  whitespace-nowrap&quot; data-delay=&quot;100&quot; data-words=&quot;your business.,your portfolio.,your startup.,digital marketing.&quot;&gt;&lt;/span&gt;&lt;span class=&quot;cursor !text-[#3f78e0] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;&lt;/h1&gt;
+        &lt;h1 class=&quot;text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-5 md:mx-10 lg:mx-0&quot;&gt;Create a powerful but effortless website for &lt;br /&gt;&lt;span class=&quot;typer !text-[#e31e24]  whitespace-nowrap&quot; data-delay=&quot;100&quot; data-words=&quot;your business.,your portfolio.,your startup.,digital marketing.&quot;&gt;&lt;/span&gt;&lt;span class=&quot;cursor !text-[#e31e24] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;&lt;/h1&gt;
         &lt;p class=&quot;lead text-[1.15rem] !mb-7&quot;&gt;Build your website in minutes with the help of countless amazing features of Trunçgil.&lt;/p&gt;
         &lt;div class=&quot;flex justify-center lg:!justify-start !mb-4&quot; data-cues=&quot;slideInDown&quot; data-group=&quot;page-title-buttons&quot; data-delay=&quot;900&quot;&gt;
-          &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 scroll&quot; href=&quot;#demos&quot;&gt;Check Demos&lt;/a&gt;&lt;/span&gt;
+          &lt;span&gt;&lt;a class=&quot;btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 scroll&quot; href=&quot;#demos&quot;&gt;Check Demos&lt;/a&gt;&lt;/span&gt;
         &lt;/div&gt;
       &lt;/div&gt;
       &lt;!-- /column --&gt;
@@ -3105,9 +3105,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/misc.html b/public/docs/blocks/misc.html
index bb3e30c..f196c3e 100644
--- a/public/docs/blocks/misc.html
+++ b/public/docs/blocks/misc.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -585,7 +585,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='features.html'>Features</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='footer.html'>Footer</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='hero.html'>Hero</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='misc.html'>Misc</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='misc.html'>Misc</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='navbar.html'>Navbar</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='portfolio.html'>Portfolio</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='pricing.html'>Pricing</a></li>
@@ -601,7 +601,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
-            <h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3">Job Positions</h2>
+            <h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3">Job Positions</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-10 xxl:!px-20">We’re always searching for amazing people to join our team. Take a look at our current openings.</h3>
           </div>
           <!-- /column -->
@@ -615,7 +615,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(226,98,107)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">SD</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Senior Graphic Designer</h4>
                   <p class="!mb-0 !text-[#60697b]">San Francisco, US</p>
                 </div>
@@ -645,7 +645,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(250,183,88)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">AN</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Multimedia Artist &amp; Animator</h4>
                   <p class="!mb-0 !text-[#60697b]">Birmingham, UK</p>
                 </div>
@@ -675,7 +675,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(247,139,119)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">MD</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Mobile Developer</h4>
                   <p class="!mb-0 !text-[#60697b]">San Francisco, US</p>
                 </div>
@@ -690,7 +690,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[rgba(209,107,134)] !opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">ND</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">.NET Developer</h4>
                   <p class="!mb-0 !text-[#60697b]">Manchester, UK</p>
                 </div>
@@ -704,7 +704,7 @@
           <div class="lg:w-6/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-3">Can't find the right position?</h2>
             <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-5 xl:!px-3 lg:!px-3 md:!px-24">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Get in Touch</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Get in Touch</a>
           </div>
           <!-- /column -->
         </div>
@@ -725,7 +725,7 @@
   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
     &#60;div class="flex flex-wrap mx-[-15px] !text-center"&#62;
       &#60;div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"&#62;
-        &#60;h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3"&#62;Job Positions&#60;/h2&#62;
+        &#60;h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3"&#62;Job Positions&#60;/h2&#62;
         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-10 xxl:!px-20"&#62;We&#8217;re always searching for amazing people to join our team. Take a look at our current openings.&#60;/h3&#62;
       &#60;/div&#62;
       &#60;!-- /column --&#62;
@@ -739,7 +739,7 @@
               &#60;span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(226,98,107)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4"&#62;SD&#60;/span&#62;
             &#60;/div&#62;
             &#60;div&#62;
-              &#60;span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
+              &#60;span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
               &#60;h4 class="!mb-1"&#62;Senior Graphic Designer&#60;/h4&#62;
               &#60;p class="!mb-0 !text-[#60697b]"&#62;San Francisco, US&#60;/p&#62;
             &#60;/div&#62;
@@ -769,7 +769,7 @@
               &#60;span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(250,183,88)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4"&#62;AN&#60;/span&#62;
             &#60;/div&#62;
             &#60;div&#62;
-              &#60;span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
+              &#60;span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
               &#60;h4 class="!mb-1"&#62;Multimedia Artist &#38;amp; Animator&#60;/h4&#62;
               &#60;p class="!mb-0 !text-[#60697b]"&#62;Birmingham, UK&#60;/p&#62;
             &#60;/div&#62;
@@ -799,7 +799,7 @@
               &#60;span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(247,139,119)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4"&#62;MD&#60;/span&#62;
             &#60;/div&#62;
             &#60;div&#62;
-              &#60;span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
+              &#60;span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
               &#60;h4 class="!mb-1"&#62;Mobile Developer&#60;/h4&#62;
               &#60;p class="!mb-0 !text-[#60697b]"&#62;San Francisco, US&#60;/p&#62;
             &#60;/div&#62;
@@ -814,7 +814,7 @@
               &#60;span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[rgba(209,107,134)] !opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4"&#62;ND&#60;/span&#62;
             &#60;/div&#62;
             &#60;div&#62;
-              &#60;span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
+              &#60;span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2"&#62;Full Time&#60;/span&#62;
               &#60;h4 class="!mb-1"&#62;.NET Developer&#60;/h4&#62;
               &#60;p class="!mb-0 !text-[#60697b]"&#62;Manchester, UK&#60;/p&#62;
             &#60;/div&#62;
@@ -828,7 +828,7 @@
       &#60;div class="lg:w-6/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center"&#62;
         &#60;h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-3"&#62;Can't find the right position?&#60;/h2&#62;
         &#60;p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-5 xl:!px-3 lg:!px-3 md:!px-24"&#62;Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur.&#60;/p&#62;
-        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Get in Touch&#60;/a&#62;
+        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Get in Touch&#60;/a&#62;
       &#60;/div&#62;
       &#60;!-- /column --&#62;
     &#60;/div&#62;
@@ -1229,9 +1229,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/navbar.html b/public/docs/blocks/navbar.html
index 4015411..b60fa4f 100644
--- a/public/docs/blocks/navbar.html
+++ b/public/docs/blocks/navbar.html
@@ -557,13 +557,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -607,7 +607,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='footer.html'>Footer</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='hero.html'>Hero</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='misc.html'>Misc</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='navbar.html'>Navbar</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='navbar.html'>Navbar</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='portfolio.html'>Portfolio</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='pricing.html'>Pricing</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='process.html'>Process</a></li>
@@ -630,7 +630,7 @@
     <section id="snippet-1" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-14">
         <h2 class="!mb-3 !leading-[1.35]">Center Nav - Transparent Background</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo1.html' target='_blank'>Demo 1</a> or <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo4.html' target='_blank'>Demo 4</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo1.html' target='_blank'>Demo 1</a> or <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo4.html' target='_blank'>Demo 4</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -778,7 +778,7 @@
                     </ul>
                   </li>
                   <li class="nav-item hidden xl:block lg:block md:block">
-                    <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]' href='../../contact.html'>Contact</a>
+                    <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]' href='../../contact.html'>Contact</a>
                   </li>
                   <li class="nav-item xl:!hidden lg:!hidden">
                     <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -948,7 +948,7 @@
                             &#60;/ul&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                            &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
+                            &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                             &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -979,7 +979,7 @@
   &quot;otherClassList&quot;: &quot;w-full flex !ml-auto&quot;,
   &quot;otherLanguageSelect&quot;: true,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Contact&quot;,
   &quot;otherBtnLink&quot;: &quot;&commat;&commat;webRoot/contact.html&quot;
 })</code></pre>
@@ -998,7 +998,7 @@
     <section id="snippet-2" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Center Nav - Transparent Background - Light Text</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo3.html' target='_blank'>Demo 3</a> or <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo15.html' target='_blank'>Demo 15</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo3.html' target='_blank'>Demo 3</a> or <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo15.html' target='_blank'>Demo 15</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -1368,7 +1368,7 @@
     <section id="snippet-3" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Center Nav - Light Background</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../shop.html' target='_blank'>Shop</a> or <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../shop-product.html' target='_blank'>Product Page</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../shop.html' target='_blank'>Shop</a> or <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../shop-product.html' target='_blank'>Product Page</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -1516,7 +1516,7 @@
                     </ul>
                   </li>
                   <li class="nav-item hidden xl:block lg:block md:block">
-                    <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]' href='../../contact.html'>Contact</a>
+                    <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]' href='../../contact.html'>Contact</a>
                   </li>
                   <li class="nav-item xl:!hidden lg:!hidden">
                     <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -1686,7 +1686,7 @@
                             &#60;/ul&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                            &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
+                            &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                             &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -1716,7 +1716,7 @@
   &quot;otherClassList&quot;: &quot;w-full flex !ml-auto&quot;,
   &quot;otherLanguageSelect&quot;: true,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Contact&quot;,
   &quot;otherBtnLink&quot;: &quot;&commat;&commat;webRoot/contact.html&quot;
 })</code></pre>
@@ -1882,7 +1882,7 @@
                     </ul>
                   </li>
                   <li class="nav-item hidden xl:block lg:block md:block">
-                    <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]' href='../../contact.html'>Contact</a>
+                    <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]' href='../../contact.html'>Contact</a>
                   </li>
                   <li class="nav-item xl:!hidden lg:!hidden">
                     <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -2052,7 +2052,7 @@
                             &#60;/ul&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                            &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
+                            &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                             &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -2083,7 +2083,7 @@
   &quot;otherClassList&quot;: &quot;w-full flex !ml-auto&quot;,
   &quot;otherLanguageSelect&quot;: true,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Contact&quot;,
   &quot;otherBtnLink&quot;: &quot;&commat;&commat;webRoot/contact.html&quot;
 })</code></pre>
@@ -2102,7 +2102,7 @@
     <section id="snippet-5" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Center Nav - Fancy</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo7.html' target='_blank'>Demo 7</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo7.html' target='_blank'>Demo 7</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -2251,7 +2251,7 @@
                       </ul>
                     </li>
                     <li class="nav-item hidden xl:block lg:block md:block">
-                      <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]' href='../../contact.html'>Contact</a>
+                      <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]' href='../../contact.html'>Contact</a>
                     </li>
                     <li class="nav-item xl:!hidden lg:!hidden">
                       <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -2424,7 +2424,7 @@
                               &#60;/ul&#62;
                             &#60;/li&#62;
                             &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                              &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
+                              &#60;a href="../../contact.html" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]"&#62;Contact&#60;/a&#62;
                             &#60;/li&#62;
                             &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                               &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -2457,7 +2457,7 @@
   &quot;otherClassList&quot;: &quot;w-full flex !ml-auto&quot;,
   &quot;otherLanguageSelect&quot;: true,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Contact&quot;,
   &quot;otherBtnLink&quot;: &quot;&commat;&commat;webRoot/contact.html&quot;
 })</code></pre>
@@ -2476,7 +2476,7 @@
     <section id="snippet-6" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Classic - Transparent Background</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo6.html' target='_blank'>Demo 6</a> or <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo8.html' target='_blank'>Demo 8</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo6.html' target='_blank'>Demo 6</a> or <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo8.html' target='_blank'>Demo 8</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -2617,7 +2617,7 @@
                 <ul class="navbar-nav !flex-row !items-center !ml-auto">
                   <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info"><i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"></i></a></li>
                   <li class="nav-item hidden xl:block lg:block md:block">
-                    <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
+                    <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
                   </li>
                   <li class="nav-item xl:!hidden lg:!hidden">
                     <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -2647,7 +2647,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPassword">Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -2693,7 +2693,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPasswordConfirm">Confirm Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -2725,7 +2725,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -2904,7 +2904,7 @@
                         &#60;ul class="navbar-nav !flex-row !items-center !ml-auto"&#62;
                           &#60;li class="nav-item"&#62;&#60;a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info"&#62;&#60;i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/li&#62;
                           &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                            &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
+                            &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                             &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -2933,7 +2933,7 @@
   &quot;classList&quot;: &quot;classic transparent navbar-light&quot;,
   &quot;otherClassList&quot;: &quot;lg:!ml-4&quot;,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Sign In&quot;,
   &quot;otherBtnModal&quot;: true,
   &quot;otherInfo&quot;: true
@@ -2953,7 +2953,7 @@
     <section id="snippet-7" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Classic - Transparent Background - Light Text</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo11.html' target='_blank'>Demo 11</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo11.html' target='_blank'>Demo 11</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -3125,7 +3125,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPassword3">Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -3171,7 +3171,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPasswordConfirm2">Confirm Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin2" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -3203,7 +3203,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -3573,7 +3573,7 @@
                 <ul class="navbar-nav !flex-row !items-center !ml-auto">
                   <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info3"><i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"></i></a></li>
                   <li class="nav-item hidden xl:block lg:block md:block">
-                    <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
+                    <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
                   </li>
                   <li class="nav-item xl:!hidden lg:!hidden">
                     <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -3603,7 +3603,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPassword5">Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -3649,7 +3649,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPasswordConfirm3">Confirm Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin3" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -3681,7 +3681,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -3859,7 +3859,7 @@
                         &#60;ul class="navbar-nav !flex-row !items-center !ml-auto"&#62;
                           &#60;li class="nav-item"&#62;&#60;a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info3"&#62;&#60;i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/li&#62;
                           &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                            &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
+                            &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                             &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -3888,7 +3888,7 @@
   &quot;classList&quot;: &quot;classic navbar-light !bg-[#ffffff] &quot;,
   &quot;otherClassList&quot;: &quot;lg:!ml-4&quot;,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Sign In&quot;,
   &quot;otherBtnModal&quot;: true,
   &quot;otherInfo&quot;: true
@@ -4048,7 +4048,7 @@
                 <ul class="navbar-nav !flex-row !items-center !ml-auto">
                   <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info4"><i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"></i></a></li>
                   <li class="nav-item hidden xl:block lg:block md:block">
-                    <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
+                    <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
                   </li>
                   <li class="nav-item xl:!hidden lg:!hidden">
                     <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -4078,7 +4078,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPassword7">Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -4124,7 +4124,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPasswordConfirm4">Confirm Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin4" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -4156,7 +4156,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -4334,7 +4334,7 @@
                         &#60;ul class="navbar-nav !flex-row !items-center !ml-auto"&#62;
                           &#60;li class="nav-item"&#62;&#60;a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info4"&#62;&#60;i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/li&#62;
                           &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                            &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
+                            &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
                           &#60;/li&#62;
                           &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                             &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -4364,7 +4364,7 @@
   &quot;logoLight&quot;: true,
   &quot;otherClassList&quot;: &quot;lg:!ml-4&quot;,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Sign In&quot;,
   &quot;otherBtnModal&quot;: true,
   &quot;otherInfo&quot;: true
@@ -4525,7 +4525,7 @@
                   <ul class="navbar-nav !flex-row !items-center !ml-auto">
                     <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info5"><i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"></i></a></li>
                     <li class="nav-item hidden xl:block lg:block md:block">
-                      <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
+                      <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink">Sign In</a>
                     </li>
                     <li class="nav-item xl:!hidden lg:!hidden">
                       <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -4557,7 +4557,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPassword9">Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -4603,7 +4603,7 @@
                       <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                       <label for="loginPasswordConfirm5">Confirm Password</label>
                     </div>
-                    <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                    <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                   </form>
                   <!-- /form -->
                   <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin5" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -4635,7 +4635,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -4815,7 +4815,7 @@
                           &#60;ul class="navbar-nav !flex-row !items-center !ml-auto"&#62;
                             &#60;li class="nav-item"&#62;&#60;a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info5"&#62;&#60;i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/li&#62;
                             &#60;li class="nav-item hidden xl:block lg:block md:block"&#62;
-                              &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
+                              &#60;a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="trueLink"&#62;Sign In&#60;/a&#62;
                             &#60;/li&#62;
                             &#60;li class="nav-item xl:!hidden lg:!hidden"&#62;
                               &#60;button class="hamburger offcanvas-nav-btn"&#62;&#60;span&#62;&#60;/span&#62;&#60;/button&#62;
@@ -4847,7 +4847,7 @@
   &quot;fancy&quot;: true,
   &quot;otherClassList&quot;: &quot;lg:!ml-4&quot;,
   &quot;otherBtn&quot;: true,
-  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;,
+  &quot;otherBtnClassList&quot;: &quot;btn-sm btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;,
   &quot;otherBtnText&quot;: &quot;Sign In&quot;,
   &quot;otherBtnModal&quot;: true,
   &quot;otherInfo&quot;: true
@@ -5225,7 +5225,7 @@
     <section id="snippet-12" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Center Logo - Transparent Background - Light Text</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo13.html' target='_blank'>Demo 13</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo13.html' target='_blank'>Demo 13</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -6668,7 +6668,7 @@
     <section id="snippet-16" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Extended</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo12.html' target='_blank'>Demo 12</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo12.html' target='_blank'>Demo 12</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -6851,7 +6851,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -7088,7 +7088,7 @@
     <section id="snippet-17" class="wrapper !bg-[#ffffff]  border-b-[rgba(164,174,198,0.2)] border-b border-solid">
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <h2 class="!mb-3 !leading-[1.35]">Extended - Alternative</h2>
-        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo24.html' target='_blank'>Demo 24</a>.</p>
+        <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-0">Check out some of the live examples: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo24.html' target='_blank'>Demo 24</a>.</p>
       </div>
       <!-- /.container -->
       <div class="container-fluid pt-10 xl:pt-14 lg:pt-14 md:pt-14 pb-14 xl:pb-[4.5rem] lg:pb-[4.5rem] md:pb-[4.5rem] xxl:!px-10">
@@ -7263,7 +7263,7 @@
               <div class="widget !mb-8">
                 <h4 class="widget-title !text-white !mb-3">Contact Info</h4>
                 <address class=" not-italic !leading-[inherit] !mb-4"> Moonshine St. 14/05 <br> Light City, London </address>
-                <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+                <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
               </div>
               <!-- /.widget -->
               <div class="widget !mb-8">
@@ -7517,9 +7517,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/portfolio.html b/public/docs/blocks/portfolio.html
index 956ad1e..bea0e42 100644
--- a/public/docs/blocks/portfolio.html
+++ b/public/docs/blocks/portfolio.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -587,7 +587,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='hero.html'>Hero</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='misc.html'>Misc</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='navbar.html'>Navbar</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='portfolio.html'>Portfolio</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='portfolio.html'>Portfolio</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='pricing.html'>Pricing</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='process.html'>Process</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='team.html'>Team</a></li>
@@ -714,7 +714,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd7.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Cras Fermentum Sem</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Cras Fermentum Sem</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                   </div>
                   <!-- /.post-header -->
@@ -726,7 +726,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd8.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project2.html'>Mollis Ipsum Mattis</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project2.html'>Mollis Ipsum Mattis</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Magazine, Book</div>
                   </div>
                   <!-- /.post-header -->
@@ -738,7 +738,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd9.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project3.html'>Ipsum Ultricies Cursus</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project3.html'>Ipsum Ultricies Cursus</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                   </div>
                   <!-- /.post-header -->
@@ -750,7 +750,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd10.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Inceptos Euismod Egestas</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Inceptos Euismod Egestas</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary, Branding</div>
                   </div>
                   <!-- /.post-header -->
@@ -762,7 +762,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd11.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project2.html'>Ipsum Mollis Vulputate</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project2.html'>Ipsum Mollis Vulputate</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                   </div>
                   <!-- /.post-header -->
@@ -774,7 +774,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd12.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project3.html'>Porta Ornare Cras</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project3.html'>Porta Ornare Cras</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Branding</div>
                   </div>
                   <!-- /.post-header -->
@@ -816,7 +816,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd7.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Cras Fermentum Sem&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Cras Fermentum Sem&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Stationary&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -828,7 +828,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd8.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Mollis Ipsum Mattis&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Mollis Ipsum Mattis&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Magazine, Book&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -840,7 +840,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd9.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Ipsum Ultricies Cursus&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Ipsum Ultricies Cursus&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Packaging&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -852,7 +852,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd10.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Inceptos Euismod Egestas&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Inceptos Euismod Egestas&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Stationary, Branding&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -864,7 +864,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd11.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Ipsum Mollis Vulputate&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Ipsum Mollis Vulputate&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Packaging&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -876,7 +876,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd12.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Porta Ornare Cras&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Porta Ornare Cras&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Branding&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1344,7 +1344,7 @@
           </div>
           <!--/column -->
           <div class="md:w-4/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-auto lg:!ml-auto md:!ml-auto xl:!text-right lg:!text-right md:!text-right !mt-5 xl:!mt-0 lg:!mt-0 md:!mt-0">
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Projects</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Projects</a>
           </div>
           <!--/column -->
         </div>
@@ -1373,10 +1373,10 @@
           <div class="card-body p-14">
             <div class="flex flex-wrap mx-[-15px] !mt-[-50px] items-center">
               <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!order-2 xl:!ml-[8.33333333%] lg:!order-2 lg:!ml-[8.33333333%] !mt-[50px]">
-                <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-3 !text-[#3f78e0]">Mobile Design</div>
+                <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-3 !text-[#e31e24]">Mobile Design</div>
                 <h3 class="h1 post-title !mb-3 !leading-[1.3]">Budget App</h3>
                 <p>Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus cursus.</p>
-                <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">See Project</a>
+                <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">See Project</a>
               </div>
               <!-- /column -->
               <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[50px]">
@@ -1440,7 +1440,7 @@
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="md:w-4/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-auto lg:!ml-auto md:!ml-auto xl:!text-right lg:!text-right md:!text-right !mt-5 xl:!mt-0 lg:!mt-0 md:!mt-0"&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Projects&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Projects&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
@@ -1469,10 +1469,10 @@
                       &#60;div class="card-body p-14"&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] !mt-[-50px] items-center"&#62;
                           &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!order-2 xl:!ml-[8.33333333%] lg:!order-2 lg:!ml-[8.33333333%] !mt-[50px]"&#62;
-                            &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-3 !text-[#3f78e0]"&#62;Mobile Design&#60;/div&#62;
+                            &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-3 !text-[#e31e24]"&#62;Mobile Design&#60;/div&#62;
                             &#60;h3 class="h1 post-title !mb-3 !leading-[1.3]"&#62;Budget App&#60;/h3&#62;
                             &#60;p&#62;Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus cursus.&#60;/p&#62;
-                            &#60;a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]"&#62;See Project&#60;/a&#62;
+                            &#60;a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]"&#62;See Project&#60;/a&#62;
                           &#60;/div&#62;
                           &#60;!-- /column --&#62;
                           &#60;div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[50px]"&#62;
@@ -1534,7 +1534,7 @@
         <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
           <div class="flex flex-wrap mx-[-15px]">
             <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-              <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]">Latest Projects</h2>
+              <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]">Latest Projects</h2>
              <h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-bold !tracking-[-.01rem] !mb-[2.5rem] !leading-[1.25]">Check out some of our awesome projects with creative ideas and great design.</h3>
             </div>
             <!-- /column -->
@@ -1547,7 +1547,7 @@
                   <figure class="!rounded-[.4rem] !mb-7"><a href='../../single-project.html'><img src="../../assets/img/photos/sp1.jpg" alt="image"></a></figure>
                   <div class="project-details flex justify-center flex-col">
                     <div class="post-header">
-                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Cras Fermentum Sem</a></h2>
+                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Cras Fermentum Sem</a></h2>
                       <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Mobile Design</div>
                     </div>
                     <!-- /.post-header -->
@@ -1559,7 +1559,7 @@
                   <figure class="!rounded-[.4rem] !mb-7"><a href='../../single-project.html'><img src="../../assets/img/photos/sp2.jpg" alt="image"></a></figure>
                   <div class="project-details flex justify-center flex-col">
                     <div class="post-header">
-                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Venenatis Euismod Vehicula</a></h2>
+                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Venenatis Euismod Vehicula</a></h2>
                       <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Web Design</div>
                     </div>
                     <!-- /.post-header -->
@@ -1571,7 +1571,7 @@
                   <figure class="!rounded-[.4rem] !mb-7"><a href='../../single-project.html'><img src="../../assets/img/photos/sp3.jpg" alt="image"></a></figure>
                   <div class="project-details flex justify-center flex-col">
                     <div class="post-header">
-                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Tortor Tellus Cursus</a></h2>
+                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Tortor Tellus Cursus</a></h2>
                       <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                     </div>
                     <!-- /.post-header -->
@@ -1583,7 +1583,7 @@
                   <figure class="!rounded-[.4rem] !mb-7"><a href='../../single-project.html'><img src="../../assets/img/photos/sp4.jpg" alt="image"></a></figure>
                   <div class="project-details flex justify-center flex-col">
                     <div class="post-header">
-                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Ridiculus Sem Parturient</a></h2>
+                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Ridiculus Sem Parturient</a></h2>
                       <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Web Application</div>
                     </div>
                     <!-- /.post-header -->
@@ -1595,7 +1595,7 @@
                   <figure class="!rounded-[.4rem] !mb-7"><a href='../../single-project.html'><img src="../../assets/img/photos/sp5.jpg" alt="image"></a></figure>
                   <div class="project-details flex justify-center flex-col">
                     <div class="post-header">
-                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Cursus Sollicitudin Adipiscing</a></h2>
+                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Cursus Sollicitudin Adipiscing</a></h2>
                       <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Web Design</div>
                     </div>
                     <!-- /.post-header -->
@@ -1607,7 +1607,7 @@
                   <figure class="!rounded-[.4rem] !mb-7"><a href='../../single-project.html'><img src="../../assets/img/photos/sp6.jpg" alt="image"></a></figure>
                   <div class="project-details flex justify-center flex-col">
                     <div class="post-header">
-                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Fringilla Quam Vulputate</a></h2>
+                      <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Fringilla Quam Vulputate</a></h2>
                       <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                     </div>
                     <!-- /.post-header -->
@@ -1638,7 +1638,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px]"&#62;
                       &#60;div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center"&#62;
-                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35]"&#62;Latest Projects&#60;/h2&#62;
+                        &#60;h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35]"&#62;Latest Projects&#60;/h2&#62;
                        &#60;h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] font-bold !tracking-[-.01rem] !mb-[2.5rem] !leading-[1.25]"&#62;Check out some of our awesome projects with creative ideas and great design.&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
@@ -1651,7 +1651,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-7"&#62;&#60;a href="../../single-project.html"&#62;&#60;img src="../../assets/img/photos/sp1.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Cras Fermentum Sem&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Cras Fermentum Sem&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Mobile Design&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1663,7 +1663,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-7"&#62;&#60;a href="../../single-project.html"&#62;&#60;img src="../../assets/img/photos/sp2.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Venenatis Euismod Vehicula&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Venenatis Euismod Vehicula&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Web Design&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1675,7 +1675,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-7"&#62;&#60;a href="../../single-project.html"&#62;&#60;img src="../../assets/img/photos/sp3.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Tortor Tellus Cursus&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Tortor Tellus Cursus&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Stationary&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1687,7 +1687,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-7"&#62;&#60;a href="../../single-project.html"&#62;&#60;img src="../../assets/img/photos/sp4.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Ridiculus Sem Parturient&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Ridiculus Sem Parturient&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Web Application&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1699,7 +1699,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-7"&#62;&#60;a href="../../single-project.html"&#62;&#60;img src="../../assets/img/photos/sp5.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Cursus Sollicitudin Adipiscing&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Cursus Sollicitudin Adipiscing&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Web Design&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1711,7 +1711,7 @@
                             &#60;figure class="!rounded-[.4rem] !mb-7"&#62;&#60;a href="../../single-project.html"&#62;&#60;img src="../../assets/img/photos/sp6.jpg" alt="image"&#62;&#60;/a&#62;&#60;/figure&#62;
                             &#60;div class="project-details flex justify-center flex-col"&#62;
                               &#60;div class="post-header"&#62;
-                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Fringilla Quam Vulputate&#60;/a&#62;&#60;/h2&#62;
+                                &#60;h2 class="post-title h3"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Fringilla Quam Vulputate&#60;/a&#62;&#60;/h2&#62;
                                 &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Stationary&#60;/div&#62;
                               &#60;/div&#62;
                               &#60;!-- /.post-header --&#62;
@@ -1754,7 +1754,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd7.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Cras Fermentum Sem</a></h2>
+                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Cras Fermentum Sem</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                 </div>
                 <!-- /.post-header -->
@@ -1766,7 +1766,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd8.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project2.html'>Mollis Ipsum Mattis</a></h2>
+                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project2.html'>Mollis Ipsum Mattis</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Magazine, Book</div>
                 </div>
                 <!-- /.post-header -->
@@ -1778,7 +1778,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd9.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project3.html'>Ipsum Ultricies Cursus</a></h2>
+                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project3.html'>Ipsum Ultricies Cursus</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                 </div>
                 <!-- /.post-header -->
@@ -1790,7 +1790,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd10.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project.html'>Inceptos Euismod Egestas</a></h2>
+                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project.html'>Inceptos Euismod Egestas</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary, Branding</div>
                 </div>
                 <!-- /.post-header -->
@@ -1802,7 +1802,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd11.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project2.html'>Ipsum Mollis Vulputate</a></h2>
+                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project2.html'>Ipsum Mollis Vulputate</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                 </div>
                 <!-- /.post-header -->
@@ -1814,7 +1814,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../../assets/img/photos/pd12.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='../../single-project3.html'>Porta Ornare Cras</a></h2>
+                  <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='../../single-project3.html'>Porta Ornare Cras</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Branding</div>
                 </div>
                 <!-- /.post-header -->
@@ -1827,7 +1827,7 @@
         </div>
         <!-- /.grid -->
         <div class="text-center !mt-10">
-          <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Start a Project</a>
+          <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Start a Project</a>
         </div>
       </div>
       <!-- /.container -->
@@ -1856,7 +1856,7 @@
                           &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd7.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                           &#60;div class="project-details flex justify-center flex-col"&#62;
                             &#60;div class="post-header"&#62;
-                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Cras Fermentum Sem&#60;/a&#62;&#60;/h2&#62;
+                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Cras Fermentum Sem&#60;/a&#62;&#60;/h2&#62;
                               &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Stationary&#60;/div&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-header --&#62;
@@ -1868,7 +1868,7 @@
                           &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd8.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                           &#60;div class="project-details flex justify-center flex-col"&#62;
                             &#60;div class="post-header"&#62;
-                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Mollis Ipsum Mattis&#60;/a&#62;&#60;/h2&#62;
+                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Mollis Ipsum Mattis&#60;/a&#62;&#60;/h2&#62;
                               &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Magazine, Book&#60;/div&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-header --&#62;
@@ -1880,7 +1880,7 @@
                           &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd9.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                           &#60;div class="project-details flex justify-center flex-col"&#62;
                             &#60;div class="post-header"&#62;
-                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Ipsum Ultricies Cursus&#60;/a&#62;&#60;/h2&#62;
+                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Ipsum Ultricies Cursus&#60;/a&#62;&#60;/h2&#62;
                               &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Packaging&#60;/div&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-header --&#62;
@@ -1892,7 +1892,7 @@
                           &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd10.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                           &#60;div class="project-details flex justify-center flex-col"&#62;
                             &#60;div class="post-header"&#62;
-                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Inceptos Euismod Egestas&#60;/a&#62;&#60;/h2&#62;
+                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Inceptos Euismod Egestas&#60;/a&#62;&#60;/h2&#62;
                               &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Stationary, Branding&#60;/div&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-header --&#62;
@@ -1904,7 +1904,7 @@
                           &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd11.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                           &#60;div class="project-details flex justify-center flex-col"&#62;
                             &#60;div class="post-header"&#62;
-                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Ipsum Mollis Vulputate&#60;/a&#62;&#60;/h2&#62;
+                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project2.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Ipsum Mollis Vulputate&#60;/a&#62;&#60;/h2&#62;
                               &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Packaging&#60;/div&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-header --&#62;
@@ -1916,7 +1916,7 @@
                           &#60;figure class="!rounded-[.4rem] !mb-6"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/pd12.jpg" alt="image"&#62;&#60;a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"&#62;&#60;i class="uil uil-focus-add before:content-['\eb22']"&#62;&#60;/i&#62;&#60;/a&#62;&#60;/figure&#62;
                           &#60;div class="project-details flex justify-center flex-col"&#62;
                             &#60;div class="post-header"&#62;
-                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#3f78e0]"&#62;Porta Ornare Cras&#60;/a&#62;&#60;/h2&#62;
+                              &#60;h2 class="post-title h3 text-[1.1rem]"&#62;&#60;a href="../../single-project3.html" class="!text-[#343f52] hover:!text-[#e31e24]"&#62;Porta Ornare Cras&#60;/a&#62;&#60;/h2&#62;
                               &#60;div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]"&#62;Branding&#60;/div&#62;
                             &#60;/div&#62;
                             &#60;!-- /.post-header --&#62;
@@ -1929,7 +1929,7 @@
                     &#60;/div&#62;
                     &#60;!-- /.grid --&#62;
                     &#60;div class="text-center !mt-10"&#62;
-                      &#60;a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Start a Project&#60;/a&#62;
+                      &#60;a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Start a Project&#60;/a&#62;
                     &#60;/div&#62;
                   &#60;/div&#62;</code></pre>
               </div>
@@ -1958,10 +1958,10 @@
           <div class="isotope-filter !relative z-[5] filter !mb-10">            
             <ul class=" inline m-0 p-0 list-none">
               <li class="inline"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold  cursor-pointer active" data-filter="*">All</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".foods">Foods</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".drinks">Drinks</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".events">Events</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".pastries">Pastries</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".foods">Foods</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".drinks">Drinks</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".events">Events</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".pastries">Pastries</a></li>
             </ul>
           </div>
           <div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-30px] isotope">
@@ -2098,10 +2098,10 @@
                       &#60;div class="isotope-filter !relative z-[5] filter !mb-10"&#62;            
                         &#60;ul class=" inline m-0 p-0 list-none"&#62;
                           &#60;li class="inline"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold  cursor-pointer active" data-filter="*"&#62;All&#60;/a&#62;&#60;/li&#62;
-                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".foods"&#62;Foods&#60;/a&#62;&#60;/li&#62;
-                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".drinks"&#62;Drinks&#60;/a&#62;&#60;/li&#62;
-                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".events"&#62;Events&#60;/a&#62;&#60;/li&#62;
-                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".pastries"&#62;Pastries&#60;/a&#62;&#60;/li&#62;
+                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".foods"&#62;Foods&#60;/a&#62;&#60;/li&#62;
+                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".drinks"&#62;Drinks&#60;/a&#62;&#60;/li&#62;
+                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".events"&#62;Events&#60;/a&#62;&#60;/li&#62;
+                          &#60;li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"&#62;&#60;a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".pastries"&#62;Pastries&#60;/a&#62;&#60;/li&#62;
                         &#60;/ul&#62;
                       &#60;/div&#62;
                       &#60;div class="flex flex-wrap mx-[-15px] md:mx-[-15px] !mt-[-30px] isotope"&#62;
@@ -2231,7 +2231,7 @@
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="xl:w-10/12 lg:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14">
             <h2 class="!text-[0.8rem] !tracking-[0.02rem] uppercase !text-[#aab0bc] !mb-3 !leading-[1.35]">Latest Projects</h2>
-            <h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em]">Check out some of our <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"><em>awesome</em></span> projects with creative ideas and great design.</h3>
+            <h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em]">Check out some of our <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"><em>awesome</em></span> projects with creative ideas and great design.</h3>
           </div>
           <!-- /column -->
         </div>
@@ -2285,7 +2285,7 @@
               <span>Branding</span>, <span>Web Design</span>
             </div>
             <p class="!mb-6">Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus. Donec sed odio dui. Vivamus sagittis lacus vel.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See Project</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See Project</a>
           </div>
           <!-- /column -->
         </div>
@@ -2306,7 +2306,7 @@
                     &#60;div class="flex flex-wrap mx-[-15px] !text-center"&#62;
                       &#60;div class="xl:w-10/12 lg:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14"&#62;
                         &#60;h2 class="!text-[0.8rem] !tracking-[0.02rem] uppercase !text-[#aab0bc] !mb-3 !leading-[1.35]"&#62;Latest Projects&#60;/h2&#62;
-                        &#60;h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em]"&#62;Check out some of our &#60;span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"&#62;&#60;em&#62;awesome&#60;/em&#62;&#60;/span&#62; projects with creative ideas and great design.&#60;/h3&#62;
+                        &#60;h3 class="!text-[calc(1.345rem_+_1.14vw)] font-bold !leading-[1.25] xl:!text-[2.2rem] !tracking-[-0.03em]"&#62;Check out some of our &#60;span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden"&#62;&#60;em&#62;awesome&#60;/em&#62;&#60;/span&#62; projects with creative ideas and great design.&#60;/h3&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
@@ -2360,7 +2360,7 @@
                           &#60;span&#62;Branding&#60;/span&#62;, &#60;span&#62;Web Design&#60;/span&#62;
                         &#60;/div&#62;
                         &#60;p class="!mb-6"&#62;Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus. Donec sed odio dui. Vivamus sagittis lacus vel.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See Project&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See Project&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                     &#60;/div&#62;
@@ -2383,7 +2383,7 @@
         <div class="flex flex-wrap mx-[-15px] !mb-10">
           <div class="md:w-9/12 lg:w-7/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="counter-wrapper">
-              <h3 class="xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] !mb-3 !text-[#3f78e0] !leading-none !text-center counter">21</h3>
+              <h3 class="xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] !mb-3 !text-[#e31e24] !leading-none !text-center counter">21</h3>
             </div>
             <h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-3 !text-center">Functional, impressive and rich demos to start with</h2>
           </div>
@@ -2465,7 +2465,7 @@
             <!--/.card -->
           </div>
           <!-- /.project -->
-          <div class="text-center !mt-12"><a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Demos</a></div>
+          <div class="text-center !mt-12"><a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Demos</a></div>
         </div>
         <!-- /.demos-wrapper -->
       </div>
@@ -2484,7 +2484,7 @@
                     &#60;div class="flex flex-wrap mx-[-15px] !mb-10"&#62;
                       &#60;div class="md:w-9/12 lg:w-7/12 xl:w-6/12 xxl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto"&#62;
                         &#60;div class="counter-wrapper"&#62;
-                          &#60;h3 class="xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] !mb-3 !text-[#3f78e0] !leading-none !text-center counter"&#62;21&#60;/h3&#62;
+                          &#60;h3 class="xl:!text-[3.5rem] !text-[calc(1.475rem_+_2.7vw)] !mb-3 !text-[#e31e24] !leading-none !text-center counter"&#62;21&#60;/h3&#62;
                         &#60;/div&#62;
                         &#60;h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold !leading-[1.25] xl:!text-[2rem] !mb-3 !text-center"&#62;Functional, impressive and rich demos to start with&#60;/h2&#62;
                       &#60;/div&#62;
@@ -2566,7 +2566,7 @@
                         &#60;!--/.card --&#62;
                       &#60;/div&#62;
                       &#60;!-- /.project --&#62;
-                      &#60;div class="text-center !mt-12"&#62;&#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Demos&#60;/a&#62;&#60;/div&#62;
+                      &#60;div class="text-center !mt-12"&#62;&#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Demos&#60;/a&#62;&#60;/div&#62;
                     &#60;/div&#62;
                     &#60;!-- /.demos-wrapper --&#62;
                   &#60;/div&#62;</code></pre>
@@ -2600,9 +2600,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/pricing.html b/public/docs/blocks/pricing.html
index 33537b8..cc93de3 100644
--- a/public/docs/blocks/pricing.html
+++ b/public/docs/blocks/pricing.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -588,7 +588,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='misc.html'>Misc</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='navbar.html'>Navbar</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='portfolio.html'>Portfolio</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='pricing.html'>Pricing</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='pricing.html'>Pricing</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='process.html'>Process</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='team.html'>Team</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='testimonials.html'>Testimonials</a></li>
@@ -604,7 +604,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!mt-32 lg:!mt-32 !mb-3">Our Pricing</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">We offer <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">great prices</span>, premium and quality products for your business.</p>
             <p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
           </div>
           <!--/column -->
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
@@ -618,7 +618,7 @@
               <p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
             </div>
             <div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
-              <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] !absolute !z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
+              <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] !absolute !z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
               <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="pricing card">
@@ -630,13 +630,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Premium Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                       <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -653,13 +653,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Corporate Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -690,7 +690,7 @@
                         &#60;h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!mt-32 lg:!mt-32 !mb-3"&#62;Our Pricing&#60;/h2&#62;
                         &#60;p class="lead !text-[1.05rem] !leading-[1.6] font-medium"&#62;We offer &#60;span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]"&#62;great prices&#60;/span&#62;, premium and quality products for your business.&#60;/p&#62;
                         &#60;p&#62;Enjoy a &#60;a href="#" class="hover"&#62;free 30-day trial&#60;/a&#62; and experience the full service. No credit card required!&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Prices&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Prices&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]"&#62;
@@ -704,7 +704,7 @@
                           &#60;p class="!mb-0 !pl-3 !relative"&#62;Yearly &#60;span class="!text-[#e2626b]"&#62;(Save 30%)&#60;/span&#62;&#60;/p&#62;
                         &#60;/div&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative"&#62;
-                          &#60;div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] !absolute !z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"&#62;&#60;/div&#62;
+                          &#60;div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] !absolute !z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"&#62;&#60;/div&#62;
                           &#60;div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -2rem;"&#62;&#60;/div&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
                             &#60;div class="pricing card"&#62;
@@ -716,13 +716,13 @@
                                 &#60;!--/.prices --&#62;
                                 &#60;h4 class="card-title !mt-2"&#62;Premium Plan&#60;/h4&#62;
                                 &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8"&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;5&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;200MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;5&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;200MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                                   &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
-                                &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
+                                &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
                               &#60;/div&#62;
                               &#60;!--/.card-body --&#62;
                             &#60;/div&#62;
@@ -739,13 +739,13 @@
                                 &#60;!--/.prices --&#62;
                                 &#60;h4 class="card-title !mt-2"&#62;Corporate Plan&#60;/h4&#62;
                                 &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8"&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;20&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;300K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;500MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
-                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;20&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;300K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;500MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                  &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                                 &#60;/ul&#62;
-                                &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
+                                &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
                               &#60;/div&#62;
                               &#60;!--/.card-body --&#62;
                             &#60;/div&#62;
@@ -782,7 +782,7 @@
         </div>
         <!--/.row -->
         <div class="pricing-wrapper !relative">
-          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
           <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] hidden xl:block lg:block absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"></div>
           <div class="flex flex-wrap items-center justify-center switcher">
             <p class="!mb-0 !pr-[.75rem]">Monthly</p>
@@ -797,7 +797,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
                   <h4 class="card-title">Basic Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">mo</span></div>
@@ -805,13 +805,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
+                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -821,7 +821,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
                   <h4 class="card-title">Premium Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
@@ -829,13 +829,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -845,7 +845,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 md:!ml-[25%] w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-0 lg:!ml-0 !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                   <h4 class="card-title">Corporate Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
@@ -853,13 +853,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -892,7 +892,7 @@
                     &#60;/div&#62;
                     &#60;!--/.row --&#62;
                     &#60;div class="pricing-wrapper !relative"&#62;
-                      &#60;div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"&#62;&#60;/div&#62;
+                      &#60;div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"&#62;&#60;/div&#62;
                       &#60;div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] hidden xl:block lg:block absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"&#62;&#60;/div&#62;
                       &#60;div class="flex flex-wrap items-center justify-center switcher"&#62;
                         &#60;p class="!mb-0 !pr-[.75rem]"&#62;Monthly&#60;/p&#62;
@@ -907,7 +907,7 @@
                         &#60;div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]"&#62;
                           &#60;div class="pricing card !text-center"&#62;
                             &#60;div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]"&#62;
-                              &#60;img src="../../assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
+                              &#60;img src="../../assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
                               &#60;h4 class="card-title"&#62;Basic Plan&#60;/h4&#62;
                               &#60;div class="prices !text-[#343f52]"&#62;
                                 &#60;div class="price price-show"&#62;&#60;span class="price-currency"&#62;$&#60;/span&#62;&#60;span class="price-value"&#62;9&#60;/span&#62; &#60;span class="price-duration"&#62;mo&#60;/span&#62;&#60;/div&#62;
@@ -915,13 +915,13 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left"&#62;
-                                &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;1&#60;/strong&#62; Project &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;1&#60;/strong&#62; Project &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
                                 &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62; &#60;/span&#62;&#60;/li&#62;
                                 &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
-                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
+                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-body --&#62;
                           &#60;/div&#62;
@@ -931,7 +931,7 @@
                         &#60;div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]"&#62;
                           &#60;div class="pricing card !text-center"&#62;
                             &#60;div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]"&#62;
-                              &#60;img src="../../assets/img/icons/lineal/home.svg" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
+                              &#60;img src="../../assets/img/icons/lineal/home.svg" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
                               &#60;h4 class="card-title"&#62;Premium Plan&#60;/h4&#62;
                               &#60;div class="prices !text-[#343f52]"&#62;
                                 &#60;div class="price price-show"&#62;&#60;span class="price-currency"&#62;$&#60;/span&#62;&#60;span class="price-value"&#62;19&#60;/span&#62; &#60;span class="price-duration"&#62;mo&#60;/span&#62;&#60;/div&#62;
@@ -939,13 +939,13 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left"&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;5&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;200MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;5&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;200MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                                 &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
-                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
+                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-body --&#62;
                           &#60;/div&#62;
@@ -955,7 +955,7 @@
                         &#60;div class="md:w-6/12 lg:w-4/12 xl:w-4/12 md:!ml-[25%] w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-0 lg:!ml-0 !mt-[30px]"&#62;
                           &#60;div class="pricing card !text-center"&#62;
                             &#60;div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]"&#62;
-                              &#60;img src="../../assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
+                              &#60;img src="../../assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
                               &#60;h4 class="card-title"&#62;Corporate Plan&#60;/h4&#62;
                               &#60;div class="prices !text-[#343f52]"&#62;
                                 &#60;div class="price price-show"&#62;&#60;span class="price-currency"&#62;$&#60;/span&#62;&#60;span class="price-value"&#62;49&#60;/span&#62; &#60;span class="price-duration"&#62;mo&#60;/span&#62;&#60;/div&#62;
@@ -963,13 +963,13 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left"&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;20&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;300K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;500MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;20&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;300K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;500MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
-                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
+                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-body --&#62;
                           &#60;/div&#62;
@@ -1021,9 +1021,9 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
+                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
@@ -1045,10 +1045,10 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
                   <a href="#" class="btn btn-soft-primary !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.05)]">Choose Plan</a>
@@ -1061,7 +1061,7 @@
             <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] max-w-full !mt-[30px]">
               <div class="pricing card !bg-[#edf2fc]">
                 <div class="card-body flex-[1_1_auto] py-[60px] px-[40px] !border-0 border-[#fff]">
-                  <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !p-0 xl:!text-[1.3rem] !w-12 !h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !rounded-[100%]"> <i class="uil uil-store before:content-['\ed04']"></i> </div>
+                  <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !p-0 xl:!text-[1.3rem] !w-12 !h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !rounded-[100%]"> <i class="uil uil-store before:content-['\ed04']"></i> </div>
                   <h4 class="card-title">Corporate Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show !justify-start"><span class="price-currency">$</span><span class="price-value">29</span> <span class="price-duration">mo</span></div>
@@ -1069,13 +1069,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-primary !mt-7 !mb-8">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -1093,11 +1093,11 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>90</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>900K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>900MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>90</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>900K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>900MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
                   <a href="#" class="btn btn-soft-primary !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.05)]">Choose Plan</a>
                 </div>
@@ -1146,9 +1146,9 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8"&#62;
-                                &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;1&#60;/strong&#62; Project &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;1&#60;/strong&#62; Project &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
                                 &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62; &#60;/span&#62;&#60;/li&#62;
                                 &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
@@ -1170,10 +1170,10 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8"&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;5&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;200MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;5&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;100K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;200MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                                 &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                               &#60;a href="#" class="btn btn-soft-primary !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.05)]"&#62;Choose Plan&#60;/a&#62;
@@ -1186,7 +1186,7 @@
                         &#60;div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] max-w-full !mt-[30px]"&#62;
                           &#60;div class="pricing card !bg-[#edf2fc]"&#62;
                             &#60;div class="card-body flex-[1_1_auto] py-[60px] px-[40px] !border-0 border-[#fff]"&#62;
-                              &#60;div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !p-0 xl:!text-[1.3rem] !w-12 !h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !rounded-[100%]"&#62; &#60;i class="uil uil-store before:content-['\ed04']"&#62;&#60;/i&#62; &#60;/div&#62;
+                              &#60;div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !p-0 xl:!text-[1.3rem] !w-12 !h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !rounded-[100%]"&#62; &#60;i class="uil uil-store before:content-['\ed04']"&#62;&#60;/i&#62; &#60;/div&#62;
                               &#60;h4 class="card-title"&#62;Corporate Plan&#60;/h4&#62;
                               &#60;div class="prices !text-[#343f52]"&#62;
                                 &#60;div class="price price-show !justify-start"&#62;&#60;span class="price-currency"&#62;$&#60;/span&#62;&#60;span class="price-value"&#62;29&#60;/span&#62; &#60;span class="price-duration"&#62;mo&#60;/span&#62;&#60;/div&#62;
@@ -1194,13 +1194,13 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-primary !mt-7 !mb-8"&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;20&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;300K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;500MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;20&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;300K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;500MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !text-white bg-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
-                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
+                              &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Choose Plan&#60;/a&#62;
                             &#60;/div&#62;
                             &#60;!--/.card-body --&#62;
                           &#60;/div&#62;
@@ -1218,11 +1218,11 @@
                               &#60;/div&#62;
                               &#60;!--/.prices --&#62;
                               &#60;ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8"&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;90&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;900K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;900MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62; &#60;/span&#62;&#60;/li&#62;
-                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;90&#60;/strong&#62; Projects &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;900K&#60;/strong&#62; API Access &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62;&#60;strong&#62;900MB&#60;/strong&#62; Storage &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; Weekly &#60;strong&#62;Reports&#60;/strong&#62; &#60;/span&#62;&#60;/li&#62;
+                                &#60;li class="relative !pl-6 !mt-[0.35rem]"&#62;&#60;i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"&#62;&#60;/i&#62;&#60;span&#62; 7/24 &#60;strong&#62;Support&#60;/strong&#62;&#60;/span&#62;&#60;/li&#62;
                               &#60;/ul&#62;
                               &#60;a href="#" class="btn btn-soft-primary !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.05)]"&#62;Choose Plan&#60;/a&#62;
                             &#60;/div&#62;
@@ -1260,7 +1260,7 @@
           <!--/column -->
         </div>
         <!--/.row -->
-        <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
+        <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
         <div class="table-responsive !mt-10 xl:!mt-0 lg:!mt-0">
           <table class="table table-borderless table-striped !text-center">
             <thead>
@@ -1309,16 +1309,16 @@
               <tr>
                 <td class="option text-left">Weekly Reports</td>
                 <td>-</td>
-                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
-                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
-                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
+                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
+                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
+                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
               </tr>
               <tr>
                 <td class="option text-left">24/7 Support</td>
                 <td>-</td>
                 <td>-</td>
-                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
-                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
+                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
+                <td><i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"></i></td>
               </tr>
             </tbody>
             <tfoot>
@@ -1355,7 +1355,7 @@
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
                     &#60;!--/.row --&#62;
-                    &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Prices&#60;/a&#62;
+                    &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Prices&#60;/a&#62;
                     &#60;div class="table-responsive !mt-10 xl:!mt-0 lg:!mt-0"&#62;
                       &#60;table class="table table-borderless table-striped !text-center"&#62;
                         &#60;thead&#62;
@@ -1404,16 +1404,16 @@
                           &#60;tr&#62;
                             &#60;td class="option text-left"&#62;Weekly Reports&#60;/td&#62;
                             &#60;td&#62;-&#60;/td&#62;
-                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
-                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
-                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
+                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
+                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
+                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
                           &#60;/tr&#62;
                           &#60;tr&#62;
                             &#60;td class="option text-left"&#62;24/7 Support&#60;/td&#62;
                             &#60;td&#62;-&#60;/td&#62;
                             &#60;td&#62;-&#60;/td&#62;
-                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
-                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
+                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
+                            &#60;td&#62;&#60;i class="uil uil-check !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50%] p-1 before:content-['\e9dd']"&#62;&#60;/i&#62;&#60;/td&#62;
                           &#60;/tr&#62;
                         &#60;/tbody&#62;
                         &#60;tfoot&#62;
@@ -1459,9 +1459,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/process.html b/public/docs/blocks/process.html
index 732ed2d..9491301 100644
--- a/public/docs/blocks/process.html
+++ b/public/docs/blocks/process.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -589,7 +589,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='navbar.html'>Navbar</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='portfolio.html'>Portfolio</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='pricing.html'>Pricing</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='process.html'>Process</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='process.html'>Process</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='team.html'>Team</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='testimonials.html'>Testimonials</a></li>
         </ul>
@@ -601,7 +601,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] md:mx-[-20px] xl:mx-[-35px] items-center">
           <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]">
-            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"></div>
+            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"></div>
             <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem]" src="../../assets/img/photos/about7.jpg" alt="image"></figure>
           </div>
@@ -611,7 +611,7 @@
             <p class="lead text-[1.05rem] !leading-[1.6] !mb-6">So here are three working steps why our valued customers choose us.</p>
             <div class="flex flex-row !mb-6">
               <div>
-                <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
+                <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
               </div>
               <div>
                 <h4 class="!mb-1">Collect Ideas</h4>
@@ -620,7 +620,7 @@
             </div>
             <div class="flex flex-row !mb-6">
               <div>
-                <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
+                <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
               </div>
               <div>
                 <h4 class="!mb-1">Data Analysis</h4>
@@ -629,7 +629,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
+                <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
               </div>
               <div>
                 <h4 class="!mb-1">Finalize Product</h4>
@@ -655,7 +655,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] md:mx-[-20px] xl:mx-[-35px] items-center"&#62;
                       &#60;div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]"&#62;
-                        &#60;div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"&#62;&#60;/div&#62;
+                        &#60;div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"&#62;&#60;/div&#62;
                         &#60;div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "&#62;&#60;/div&#62;
                         &#60;figure class="!rounded-[.4rem] relative z-[2]"&#62;&#60;img class="!rounded-[.4rem]" src="../../assets/img/photos/about7.jpg" alt="image"&#62;&#60;/figure&#62;
                       &#60;/div&#62;
@@ -665,7 +665,7 @@
                         &#60;p class="lead text-[1.05rem] !leading-[1.6] !mb-6"&#62;So here are three working steps why our valued customers choose us.&#60;/p&#62;
                         &#60;div class="flex flex-row !mb-6"&#62;
                           &#60;div&#62;
-                            &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;1&#60;/span&#62;&#60;/span&#62;
+                            &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;1&#60;/span&#62;&#60;/span&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4 class="!mb-1"&#62;Collect Ideas&#60;/h4&#62;
@@ -674,7 +674,7 @@
                         &#60;/div&#62;
                         &#60;div class="flex flex-row !mb-6"&#62;
                           &#60;div&#62;
-                            &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;2&#60;/span&#62;&#60;/span&#62;
+                            &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;2&#60;/span&#62;&#60;/span&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4 class="!mb-1"&#62;Data Analysis&#60;/h4&#62;
@@ -683,7 +683,7 @@
                         &#60;/div&#62;
                         &#60;div class="flex flex-row"&#62;
                           &#60;div&#62;
-                            &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;3&#60;/span&#62;&#60;/span&#62;
+                            &#60;span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0"&#62;3&#60;/span&#62;&#60;/span&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4 class="!mb-1"&#62;Finalize Product&#60;/h4&#62;
@@ -719,7 +719,7 @@
             <p class="!mb-0">Nulla vitae elit libero elit non porta gravida eget metus cras. Aenean eu leo quam. Pellentesque ornare.</p>
           </div>
           <!--/column -->
-          <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number table-cell text-center align-middle text-[1.1rem] font-bold mx-auto my-0 !leading-none">02</span></span>
+          <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"><span class="number table-cell text-center align-middle text-[1.1rem] font-bold mx-auto my-0 !leading-none">02</span></span>
             <h4 class="!mb-1">Prepare</h4>
             <p class="!mb-0">Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.</p>
           </div>
@@ -757,7 +757,7 @@
                         &#60;p class="!mb-0"&#62;Nulla vitae elit libero elit non porta gravida eget metus cras. Aenean eu leo quam. Pellentesque ornare.&#60;/p&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
-                      &#60;div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"&#62; &#60;span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number table-cell text-center align-middle text-[1.1rem] font-bold mx-auto my-0 !leading-none"&#62;02&#60;/span&#62;&#60;/span&#62;
+                      &#60;div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"&#62; &#60;span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none !p-0 !rounded-[100%]"&#62;&#60;span class="number table-cell text-center align-middle text-[1.1rem] font-bold mx-auto my-0 !leading-none"&#62;02&#60;/span&#62;&#60;/span&#62;
                         &#60;h4 class="!mb-1"&#62;Prepare&#60;/h4&#62;
                         &#60;p class="!mb-0"&#62;Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.&#60;/p&#62;
                       &#60;/div&#62;
@@ -900,7 +900,7 @@
             <h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !mt-[3.5rem] !tracking-[0.02rem]">Our Process</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3]  !mb-0 !text-center xl:!px-10 xxl:!px-20">Find out everything you need to know about creating a business process model</h3>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] process-wrapper !text-center !mt-9">
-              <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
+              <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
                 <h4 class="!mb-1">1. Concept</h4>
                 <p>Nulla vitae elit libero elit non porta gravida eget metus cras.</p>
               </div>
@@ -953,7 +953,7 @@
                         &#60;h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !mt-[3.5rem] !tracking-[0.02rem]"&#62;Our Process&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3]  !mb-0 !text-center xl:!px-10 xxl:!px-20"&#62;Find out everything you need to know about creating a business process model&#60;/h3&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] process-wrapper !text-center !mt-9"&#62;
-                          &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"&#62; &#60;img src="../../assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
+                          &#60;div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"&#62; &#60;img src="../../assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]" alt="image"&#62;
                             &#60;h4 class="!mb-1"&#62;1. Concept&#60;/h4&#62;
                             &#60;p&#62;Nulla vitae elit libero elit non porta gravida eget metus cras.&#60;/p&#62;
                           &#60;/div&#62;
@@ -1051,7 +1051,7 @@
             <p class="lead text-[1rem] xl:!pr-5 lg:!pr-5">Find out everything you need to know and more about how we create our business process models.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare.</p>
             <p class="!mb-6">Nullam id dolor id nibh ultricies vehicula ut id elit. Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
           </div>
           <!--/column -->
         </div>
@@ -1131,7 +1131,7 @@
                         &#60;p class="lead text-[1rem] xl:!pr-5 lg:!pr-5"&#62;Find out everything you need to know and more about how we create our business process models.&#60;/p&#62;
                         &#60;p&#62;Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare.&#60;/p&#62;
                         &#60;p class="!mb-6"&#62;Nullam id dolor id nibh ultricies vehicula ut id elit. Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Learn More&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;Learn More&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                     &#60;/div&#62;
@@ -1157,11 +1157,11 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">How It Works?</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">How It Works?</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7 xxl:!pr-5">Everything you need on creating a business process.</h3>
             <div class="flex flex-row !mb-4">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  text-[#3f78e0] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  text-[#e31e24] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Collect Ideas</h4>
@@ -1209,11 +1209,11 @@
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full"&#62;
-                        &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3"&#62;How It Works?&#60;/h2&#62;
+                        &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3"&#62;How It Works?&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7 xxl:!pr-5"&#62;Everything you need on creating a business process.&#60;/h3&#62;
                         &#60;div class="flex flex-row !mb-4"&#62;
                           &#60;div&#62;
-                            &#60;img src="../../assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  !text-[#3f78e0] !mr-4" alt="image"&#62;
+                            &#60;img src="../../assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  !text-[#e31e24] !mr-4" alt="image"&#62;
                           &#60;/div&#62;
                           &#60;div&#62;
                             &#60;h4 class="!mb-1"&#62;Collect Ideas&#60;/h4&#62;
@@ -1267,19 +1267,19 @@
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6">Find out everything about creating a business model.</h3>
             <div class="flex flex-wrap mx-[-15px] !mt-[-20px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                <h4><span class="!text-[#3f78e0] ">1.</span> Creative Ideas</h4>
+                <h4><span class="!text-[#e31e24] ">1.</span> Creative Ideas</h4>
                 <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
               </div>
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                <h4><span class="!text-[#3f78e0] ">2.</span> Magic Touch</h4>
+                <h4><span class="!text-[#e31e24] ">2.</span> Magic Touch</h4>
                 <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
               </div>
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                <h4><span class="!text-[#3f78e0] ">3.</span> Data Analysis</h4>
+                <h4><span class="!text-[#e31e24] ">3.</span> Data Analysis</h4>
                 <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
               </div>
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                <h4><span class="!text-[#3f78e0] ">4.</span> Finalize Product</h4>
+                <h4><span class="!text-[#e31e24] ">4.</span> Finalize Product</h4>
                 <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
               </div>
               <!--/column -->
@@ -1312,19 +1312,19 @@
                         &#60;h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-6"&#62;Find out everything about creating a business model.&#60;/h3&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] !mt-[-20px]"&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]"&#62;
-                            &#60;h4&#62;&#60;span class="!text-[#3f78e0] "&#62;1.&#60;/span&#62; Creative Ideas&#60;/h4&#62;
+                            &#60;h4&#62;&#60;span class="!text-[#e31e24] "&#62;1.&#60;/span&#62; Creative Ideas&#60;/h4&#62;
                             &#60;p class="!mb-0"&#62;Nulla vitae elit libero a augue donec id elit non mi porta.&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]"&#62;
-                            &#60;h4&#62;&#60;span class="!text-[#3f78e0] "&#62;2.&#60;/span&#62; Magic Touch&#60;/h4&#62;
+                            &#60;h4&#62;&#60;span class="!text-[#e31e24] "&#62;2.&#60;/span&#62; Magic Touch&#60;/h4&#62;
                             &#60;p class="!mb-0"&#62;Nulla vitae elit libero a augue donec id elit non mi porta.&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]"&#62;
-                            &#60;h4&#62;&#60;span class="!text-[#3f78e0] "&#62;3.&#60;/span&#62; Data Analysis&#60;/h4&#62;
+                            &#60;h4&#62;&#60;span class="!text-[#e31e24] "&#62;3.&#60;/span&#62; Data Analysis&#60;/h4&#62;
                             &#60;p class="!mb-0"&#62;Nulla vitae elit libero a augue donec id elit non mi porta.&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]"&#62;
-                            &#60;h4&#62;&#60;span class="!text-[#3f78e0] "&#62;4.&#60;/span&#62; Finalize Product&#60;/h4&#62;
+                            &#60;h4&#62;&#60;span class="!text-[#e31e24] "&#62;4.&#60;/span&#62; Finalize Product&#60;/h4&#62;
                             &#60;p class="!mb-0"&#62;Nulla vitae elit libero a augue donec id elit non mi porta.&#60;/p&#62;
                           &#60;/div&#62;
                           &#60;!--/column --&#62;
@@ -1505,9 +1505,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/team.html b/public/docs/blocks/team.html
index e23986d..4038d00 100644
--- a/public/docs/blocks/team.html
+++ b/public/docs/blocks/team.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -590,7 +590,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='portfolio.html'>Portfolio</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='pricing.html'>Pricing</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='process.html'>Process</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='team.html'>Team</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='team.html'>Team</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='testimonials.html'>Testimonials</a></li>
         </ul>
       </div>
@@ -1117,10 +1117,10 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Meet the Team</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Meet the Team</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-5">Save your time and money by choosing our professional team.</h3>
             <p>Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros tempus porttitor.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
           </div>
           <!--/column -->
           <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
@@ -1217,10 +1217,10 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center"&#62;
                       &#60;div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#62;
-                        &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3"&#62;Meet the Team&#60;/h2&#62;
+                        &#60;h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3"&#62;Meet the Team&#60;/h2&#62;
                         &#60;h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-5"&#62;Save your time and money by choosing our professional team.&#60;/h3&#62;
                         &#60;p&#62;Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros tempus porttitor.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Members&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;See All Members&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!--/column --&#62;
                       &#60;div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]"&#62;
@@ -1335,9 +1335,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blocks/testimonials.html b/public/docs/blocks/testimonials.html
index 0816c2c..cdd7629 100644
--- a/public/docs/blocks/testimonials.html
+++ b/public/docs/blocks/testimonials.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -591,7 +591,7 @@
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='pricing.html'>Pricing</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded ' href='process.html'>Process</a></li>
           <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded' href='team.html'>Team</a></li>
-          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#3f78e0]  pointer-events-none' href='testimonials.html'>Testimonials</a></li>
+          <li class="inline-block !mr-1 !mb-2"><a class='btn btn-soft-ash btn-sm rounded !text-[#e31e24]  pointer-events-none' href='testimonials.html'>Testimonials</a></li>
         </ul>
       </div>
       <!-- /.container -->
@@ -899,7 +899,7 @@
           <div class="xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!px-[35px] !mt-[50px]">
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mt-10 !mb-3">Our Community</h2>
             <p class="lead text-[1.05rem] !leading-[1.6] !mb-6">Customer satisfaction is our major goal. See what our clients are saying about our services.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">All Testimonials</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">All Testimonials</a>
           </div>
           <!-- /column -->
           <div class="xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!px-[35px] !mt-[50px]">
@@ -1070,7 +1070,7 @@
                       &#60;div class="xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!px-[35px] !mt-[50px]"&#62;
                         &#60;h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mt-10 !mb-3"&#62;Our Community&#60;/h2&#62;
                         &#60;p class="lead text-[1.05rem] !leading-[1.6] !mb-6"&#62;Customer satisfaction is our major goal. See what our clients are saying about our services.&#60;/p&#62;
-                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;All Testimonials&#60;/a&#62;
+                        &#60;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"&#62;All Testimonials&#60;/a&#62;
                       &#60;/div&#62;
                       &#60;!-- /column --&#62;
                       &#60;div class="xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!px-[35px] !mt-[50px]"&#62;
@@ -1385,7 +1385,7 @@
         <p class="lead text-[0.9rem] font-medium !leading-[1.65] !text-center !mb-6 md:!px-24 lg:!px-0">Customer satisfaction is our major goal. See what our customers are saying about us.</p>
         <div class="!relative">
           <div class="shape !rounded-[50%] !bg-[#fff8ee] rellax !w-[6rem] !h-[6rem] absolute z-[1]" data-rellax-speed="1" style="bottom: 0.5rem; right: -1.7rem;"></div>
-          <div class="shape bg-dot primary rellax !w-[6rem] !h-[6rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -1.7rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[6rem] !h-[6rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -1.7rem;"></div>
           <div class="swiper-container dots-closer !mb-6 relative z-10" data-margin="0" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1">
             <div class="swiper">
               <div class="swiper-wrapper">
@@ -1546,7 +1546,7 @@
                     &#60;p class="lead text-[0.9rem] font-medium !leading-[1.65] !text-center !mb-6 md:!px-24 lg:!px-0"&#62;Customer satisfaction is our major goal. See what our customers are saying about us.&#60;/p&#62;
                     &#60;div class="!relative"&#62;
                       &#60;div class="shape !rounded-[50%] !bg-[#fff8ee] rellax !w-[6rem] !h-[6rem] absolute z-[1]" data-rellax-speed="1" style="bottom: 0.5rem; right: -1.7rem;"&#62;&#60;/div&#62;
-                      &#60;div class="shape bg-dot primary rellax !w-[6rem] !h-[6rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -1.7rem;"&#62;&#60;/div&#62;
+                      &#60;div class="shape bg-dot primary rellax !w-[6rem] !h-[6rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -1.7rem;"&#62;&#60;/div&#62;
                       &#60;div class="swiper-container dots-closer !mb-6 relative z-10" data-margin="0" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1"&#62;
                         &#60;div class="swiper"&#62;
                           &#60;div class="swiper-wrapper"&#62;
@@ -1709,7 +1709,7 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] items-center">
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
+            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full">
                 <figure class="rounded-[0.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[0.4rem]" src="../../assets/img/photos/g5.jpg" alt="image"></figure>
@@ -1805,7 +1805,7 @@
                   &#60;div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28 pb-16 xl:pb-20 lg:pb-20 md:pb-20"&#62;
                     &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] items-center"&#62;
                       &#60;div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full !relative"&#62;
-                        &#60;div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"&#62;&#60;/div&#62;
+                        &#60;div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"&#62;&#60;/div&#62;
                         &#60;div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]"&#62;
                           &#60;div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full"&#62;
                             &#60;figure class="rounded-[0.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"&#62;&#60;img class="!rounded-[0.4rem]" src="../../assets/img/photos/g5.jpg" alt="image"&#62;&#60;/figure&#62;
@@ -4377,9 +4377,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/blog-post.html b/public/docs/blog-post.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/blog-post.html
+++ b/public/docs/blog-post.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/changelog.html b/public/docs/changelog.html
index 0dd2646..1871817 100644
--- a/public/docs/changelog.html
+++ b/public/docs/changelog.html
@@ -650,16 +650,16 @@
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                   aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -698,12 +698,12 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='index.html'>Get Started</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='forms.html'>Forms</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='faq.html'>FAQ</a>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='index.html'>Get Started</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='forms.html'>Forms</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='faq.html'>FAQ</a>
                 </li>
                 <li class="!mt-[0.35rem]"><a class='active' href='changelog.html'>Changelog</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='credits.html'>Credits</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -713,13 +713,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/colors.html'>Colors</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/fonts.html'>Fonts</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-font.html'>Font Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/illustrations.html'>Illustrations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/colors.html'>Colors</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/fonts.html'>Fonts</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-font.html'>Font Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/illustrations.html'>Illustrations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -729,34 +729,34 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/accordion.html'>Accordion</a>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='elements/accordion.html'>Accordion</a>
                 </li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/alerts.html'>Alerts</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/animations.html'>Animations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/avatars.html'>Avatars</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/background.html'>Background</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/badges.html'>Badges</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/buttons.html'>Buttons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/card.html'>Card</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/carousel.html'>Carousel</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/dividers.html'>Dividers</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/form-elements.html'>Form Elements</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-hover.html'>Image Hover</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-mask.html'>Image Mask</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/lightbox.html'>Lightbox</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/player.html'>Media Player</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/modal.html'>Modal</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/pagination.html'>Pagination</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/progressbar.html'>Progressbar</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shadows.html'>Shadows</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shapes.html'>Shapes</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tables.html'>Tables</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tabs.html'>Tabs</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-animations.html'>Text Animations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-highlight.html'>Text Highlight</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tiles.html'>Tiles</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/typography.html'>Typography</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/alerts.html'>Alerts</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/animations.html'>Animations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/avatars.html'>Avatars</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/background.html'>Background</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/badges.html'>Badges</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/buttons.html'>Buttons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/card.html'>Card</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/carousel.html'>Carousel</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/dividers.html'>Dividers</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/form-elements.html'>Form Elements</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-hover.html'>Image Hover</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-mask.html'>Image Mask</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/lightbox.html'>Lightbox</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/player.html'>Media Player</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/modal.html'>Modal</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/pagination.html'>Pagination</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/progressbar.html'>Progressbar</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shadows.html'>Shadows</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shapes.html'>Shapes</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tables.html'>Tables</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tabs.html'>Tabs</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-animations.html'>Text Animations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-highlight.html'>Text Highlight</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tiles.html'>Tiles</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -770,15 +770,15 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-1">v1.0.0</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-2">v1.1.0</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-3">v1.2.0</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-4">v1.3.0</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-5">v2.0.0</a></li>
               </ul>
             </nav>
@@ -895,10 +895,10 @@
   </section>
   <!-- /section -->
   <div
-    class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+    class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
       <path
-        class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none"
+        class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none"
         d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
diff --git a/public/docs/credits.html b/public/docs/credits.html
index f66e9ed..2017ec9 100644
--- a/public/docs/credits.html
+++ b/public/docs/credits.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,10 +578,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='changelog.html'>Changelog</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='changelog.html'>Changelog</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='credits.html'>Credits</a></li>
               </ul>
             </nav>
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/typography.html'>Typography</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,11 +647,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">JS</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Images</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Illustrations</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Fonts</a></li>
+                <li><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">JS</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Images</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Illustrations</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Fonts</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -673,83 +673,83 @@
                   </thead>
                   <tbody>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://tailwindcss.com/" target="_blank">tailwindcss</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://tailwindcss.com/" target="_blank">tailwindcss</a></td>
                       <td>Rapidly build modern websites without ever leaving your HTML.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="http://scottjehl.github.io/picturefill/" target="_blank">Picturefill</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="http://scottjehl.github.io/picturefill/" target="_blank">Picturefill</a></td>
                       <td>A responsive image polyfill.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://markgoodyear.com/labs/headhesive/" target="_blank">Headhesive</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://markgoodyear.com/labs/headhesive/" target="_blank">Headhesive</a></td>
                       <td>An on-demand sticky header.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/prjct-samwest/scrollCue" target="_blank">scrollCue.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/prjct-samwest/scrollCue" target="_blank">scrollCue.js</a></td>
                       <td>Show elements by scrolling.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://swiperjs.com/" target="_blank">Swiper</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://swiperjs.com/" target="_blank">Swiper</a></td>
                       <td>The most modern mobile touch slider.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://dixonandmoe.com/rellax/" target="_blank">rellax.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://dixonandmoe.com/rellax/" target="_blank">rellax.js</a></td>
                       <td>A buttery smooth, super lightweight, vanilla javascript parallax library.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/Ins-V/iTooltip" target="_blank">iTooltip</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/Ins-V/iTooltip" target="_blank">iTooltip</a></td>
                       <td>Transform native tooltip’s into customizable overlays.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://plyr.io/" target="_blank">Plyr</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://plyr.io/" target="_blank">Plyr</a></td>
                       <td>A simple, accessible and customisable media player.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://biati-digital.github.io/glightbox/" target="_blank">GLightbox</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://biati-digital.github.io/glightbox/" target="_blank">GLightbox</a></td>
                       <td>A touchable pure Javascript lightbox with mobile and video support.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://isotope.metafizzy.co/" target="_blank">Isotope</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://isotope.metafizzy.co/" target="_blank">Isotope</a></td>
                       <td>Filter & sort magical layouts.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/bfintal/Counter-Up2" target="_blank">Counter-Up2</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/bfintal/Counter-Up2" target="_blank">Counter-Up2</a></td>
                       <td>Count up to a targeted number when the number becomes visible.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="http://imakewebthings.com/waypoints/" target="_blank">Waypoints</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="http://imakewebthings.com/waypoints/" target="_blank">Waypoints</a></td>
                       <td>The easiest way to trigger a function when you scroll to an element.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://kimmobrunfeldt.github.io/progressbar.js/" target="_blank">Progressbar.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://kimmobrunfeldt.github.io/progressbar.js/" target="_blank">Progressbar.js</a></td>
                       <td>Responsive and slick progress bars with animated SVG paths.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://clipboardjs.com/" target="_blank">clipboard.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://clipboardjs.com/" target="_blank">clipboard.js</a></td>
                       <td>A modern approach to copy text to clipboard.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://prismjs.com/" target="_blank">prism.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://prismjs.com/" target="_blank">prism.js</a></td>
                       <td>Lightweight, extensible syntax highlighter.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/iconfu/svg-inject" target="_blank">SVGInject</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/iconfu/svg-inject" target="_blank">SVGInject</a></td>
                       <td>Replaces an img element with an inline SVG.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://steven.codes/typerjs/" target="_blank">Typer.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://steven.codes/typerjs/" target="_blank">Typer.js</a></td>
                       <td>The typing effect with a pure HTML interface.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/iamdustan/smoothscroll" target="_blank">smoothscroll.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/iamdustan/smoothscroll" target="_blank">smoothscroll.js</a></td>
                       <td>Smooth Scroll behavior polyfill.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://adrianklimek.github.io/replaceme/" target="_blank">ReplaceMe.js</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://adrianklimek.github.io/replaceme/" target="_blank">ReplaceMe.js</a></td>
                       <td>Lightweight text rotator written in vanilla JS.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://bootstrapious.com/p/how-to-build-a-working-bootstrap-contact-form" target="_blank">Contact Form</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://bootstrapious.com/p/how-to-build-a-working-bootstrap-contact-form" target="_blank">Contact Form</a></td>
                       <td>Tutorial that was used to build the contact forms on the template.</td>
                     </tr>
                   </tbody>
@@ -764,7 +764,7 @@
             <div class="card">
               <div class="card-body p-[40px]">
                 <h3>Pexels</h3>
-                <p class="!mb-5">To reach the collection of all images/videos from Pexels used in Trunçgil, click <a href="https://www.pexels.com/collections/Trunçgil-gbw1t9c/" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
+                <p class="!mb-5">To reach the collection of all images/videos from Pexels used in Trunçgil, click <a href="https://www.pexels.com/collections/Trunçgil-gbw1t9c/" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
                 <div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-6">
                   <div class="item md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <figure class="lift rounded"><a href="https://www.pexels.com/photo/man-in-blue-collared-top-using-imac-indoors-3182782/" target="_blank"><img src="../assets/img/docs/pex1.jpg" alt="image"></a></figure>
@@ -782,7 +782,7 @@
                 <!--/.row -->
                 <hr class="!mt-[3rem] !mb-10">
                 <h3>Rawpixel</h3>
-                <p class="!mb-5">To reach the collection of all images from Rawpixel used in Trunçgil, click <a href="https://www.rawpixel.com/community-board/1391692/Trunçgil?sort=last_added&amp;mode=shop&amp;page=1" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
+                <p class="!mb-5">To reach the collection of all images from Rawpixel used in Trunçgil, click <a href="https://www.rawpixel.com/community-board/1391692/Trunçgil?sort=last_added&amp;mode=shop&amp;page=1" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
                 <div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-6">
                   <div class="item md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <figure class="lift rounded"><a href="https://www.rawpixel.com/image/56901/premium-photo-image-african-descent-analysing-analysis" target="_blank"><img src="../assets/img/docs/raw1.jpg" alt="image"></a></figure>
@@ -800,7 +800,7 @@
                 <!--/.row -->
                 <hr class="!mt-[3rem] !mb-10">
                 <h3>Unsplash</h3>
-                <p class="!mb-5">To reach the collection of all images from Unsplash used in Trunçgil, click <a href="https://unsplash.com/collections/vn4OtMorwCA/Trunçgil" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
+                <p class="!mb-5">To reach the collection of all images from Unsplash used in Trunçgil, click <a href="https://unsplash.com/collections/vn4OtMorwCA/Trunçgil" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
                 <div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-6">
                   <div class="item md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <figure class="lift rounded"><a href="https://unsplash.com/photos/DMl5gG0yWWY" target="_blank"><img src="../assets/img/docs/un1.jpg" alt="image"></a></figure>
@@ -818,7 +818,7 @@
                 <!--/.row -->
                 <hr class="!mt-[3rem] !mb-10">
                 <h3>Freepik</h3>
-                <p class="!mb-5">To reach the Freepik collection first make sure you are logged into Freepik, then click <a href="https://www.freepik.com/user/collections/Trunçgil/2260699" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
+                <p class="!mb-5">To reach the Freepik collection first make sure you are logged into Freepik, then click <a href="https://www.freepik.com/user/collections/Trunçgil/2260699" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">here</a>.</p>
                 <div class="flex flex-wrap mx-[-15px] !mt-[-30px] !mb-6">
                   <div class="item md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <figure class="lift rounded"><a href="https://www.freepik.com/free-photo/community-young-people-posing-together_6981911.htm#&position=0&from_view=collections" target="_blank"><img src="../assets/img/docs/fre1.jpg" alt="image"></a></figure>
@@ -852,29 +852,29 @@
                 </div>
                 <!--/.row -->
                 <p class="!mb-0">
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-macarons-box-packaging-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se3.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/product-psd-stationery-mockup-set" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se4.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-paper-bag-mockup-set" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd1.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/elegant-psd-invitation-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd2.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/basic-mailing-stationery-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd3.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/small-psd-square-box-mockup-set" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd4.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-polaroid-photos-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd5.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/hardcover-psd-book-mockup-scene" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd6.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-stationery-office-pack-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp1.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/simple-stationery-branding-vol3" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp7.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/mini-envelope-psd-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp8.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/stationery-branding-mock-up-vol-5-1" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp9.jpg</a>
-                  <a href="https://www.pixeden.com/psd-web-elements/abstract-ui-project-scene-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se1.jpg</a>
-                  <a href="https://www.pixeden.com/psd-web-elements/abstract-ui-project-scene-mockup-2" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se2.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/square-psd-invitation-card-paper-wrap" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">rp1.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/stationery-psd-pocket-notebook-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">rp2.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-notebook-mockup-set" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">rp3.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-clipboard-stationery-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd7.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-magazine-mockup-vol8" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd8.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/square-psd-cardboard-box-mockup-2" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd9.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/basic-stationery-branding-vol-5" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd10.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-cardboard-packaging-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd11.jpg</a>
-                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-shopping-bag-mockup" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd12.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-macarons-box-packaging-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se3.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/product-psd-stationery-mockup-set" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se4.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-paper-bag-mockup-set" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd1.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/elegant-psd-invitation-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd2.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/basic-mailing-stationery-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd3.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/small-psd-square-box-mockup-set" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd4.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-polaroid-photos-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd5.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/hardcover-psd-book-mockup-scene" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd6.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-stationery-office-pack-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp1.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/simple-stationery-branding-vol3" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp7.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/mini-envelope-psd-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp8.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/stationery-branding-mock-up-vol-5-1" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pp9.jpg</a>
+                  <a href="https://www.pixeden.com/psd-web-elements/abstract-ui-project-scene-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se1.jpg</a>
+                  <a href="https://www.pixeden.com/psd-web-elements/abstract-ui-project-scene-mockup-2" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">se2.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/square-psd-invitation-card-paper-wrap" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">rp1.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/stationery-psd-pocket-notebook-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">rp2.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-notebook-mockup-set" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">rp3.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-clipboard-stationery-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd7.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-magazine-mockup-vol8" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd8.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/square-psd-cardboard-box-mockup-2" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd9.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/basic-stationery-branding-vol-5" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd10.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-cardboard-packaging-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd11.jpg</a>
+                  <a href="https://www.pixeden.com/psd-mock-up-templates/psd-shopping-bag-mockup" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">pd12.jpg</a>
                 </p>
                 <hr class="!mt-[3rem] !mb-10">
                 <h3 class="!mb-5">Icons8</h3>
@@ -894,18 +894,18 @@
                 </div>
                 <!--/.row -->
                 <p class="!mb-0">
-                  <a href="https://icons8.com/photos/photo/ceramic-vases-home-collection--5b0bc6ec8b658800012318f1" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs1.jpg</a>
-                  <a href="https://icons8.com/photos/photo/still-life-with-yellow-dried-flowers-and-a-lemon--5b0bc6f18b658800012318f3" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs2.jpg</a>
-                  <a href="https://icons8.com/photos/photo/tender-gifts-for-a-tender-person--5b0bc7328b6588000123190d" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs3.jpg</a>
-                  <a href="https://icons8.com/photos/photo/when-your-tea-is-made-with-love--5aba7d3a8b65880001a035cf" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs4.jpg</a>
-                  <a href="https://icons8.com/photos/photo/everything-starts-blooming-at-the-touch-of-love--5aba7d458b65880001a035d1" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs5.jpg</a>
-                  <a href="https://icons8.com/photos/photo/everything-starts-blooming-at-the-touch-of-love--5aba7d388b65880001a035ce" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs6.jpg</a>
-                  <a href="https://icons8.com/photos/photo/fruit-jelly-strip-getting-out-of-toothpaste-tube--5aba7cfc8b65880001a035ba" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs7.jpg</a>
-                  <a href="https://icons8.com/photos/photo/minute-on-the-lips-lifetime-on-the-hips--5aba7cf88b65880001a035b9" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs8.jpg</a>
-                  <a href="https://icons8.com/photos/photo/bright-idea--5aba7a4a8b65880001a035ad" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs9.jpg</a>
-                  <a href="https://icons8.com/photos/photo/some-eggs-brown-bread-and-butter--59d8d7cb0b7a6a03ae47271d" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs10.jpg</a>
-                  <a href="https://icons8.com/photos/photo/flavorful-burst-of-color-and-taste--59d8d4b00b7a6a03ae47265d" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs11.jpg</a>
-                  <a href="https://iconos8.es/photos/photo/lets-cook-mushrooms-in-a-sour-cream-sauce--59d8d4830b7a6a03ae472653" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs12.jpg</a>
+                  <a href="https://icons8.com/photos/photo/ceramic-vases-home-collection--5b0bc6ec8b658800012318f1" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs1.jpg</a>
+                  <a href="https://icons8.com/photos/photo/still-life-with-yellow-dried-flowers-and-a-lemon--5b0bc6f18b658800012318f3" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs2.jpg</a>
+                  <a href="https://icons8.com/photos/photo/tender-gifts-for-a-tender-person--5b0bc7328b6588000123190d" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs3.jpg</a>
+                  <a href="https://icons8.com/photos/photo/when-your-tea-is-made-with-love--5aba7d3a8b65880001a035cf" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs4.jpg</a>
+                  <a href="https://icons8.com/photos/photo/everything-starts-blooming-at-the-touch-of-love--5aba7d458b65880001a035d1" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs5.jpg</a>
+                  <a href="https://icons8.com/photos/photo/everything-starts-blooming-at-the-touch-of-love--5aba7d388b65880001a035ce" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs6.jpg</a>
+                  <a href="https://icons8.com/photos/photo/fruit-jelly-strip-getting-out-of-toothpaste-tube--5aba7cfc8b65880001a035ba" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs7.jpg</a>
+                  <a href="https://icons8.com/photos/photo/minute-on-the-lips-lifetime-on-the-hips--5aba7cf88b65880001a035b9" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs8.jpg</a>
+                  <a href="https://icons8.com/photos/photo/bright-idea--5aba7a4a8b65880001a035ad" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs9.jpg</a>
+                  <a href="https://icons8.com/photos/photo/some-eggs-brown-bread-and-butter--59d8d7cb0b7a6a03ae47271d" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs10.jpg</a>
+                  <a href="https://icons8.com/photos/photo/flavorful-burst-of-color-and-taste--59d8d4b00b7a6a03ae47265d" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs11.jpg</a>
+                  <a href="https://iconos8.es/photos/photo/lets-cook-mushrooms-in-a-sour-cream-sauce--59d8d4830b7a6a03ae472653" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">cs12.jpg</a>
                 </p>
                 <hr class="!mt-[3rem] !mb-10">
                 <h3 class="!mb-5">Mockups</h3>
@@ -976,7 +976,7 @@
           </section>
           <section id="snippet-3" class="wrapper pt-24">
             <h2 class="!mb-3 !leading-[1.35]">Icons</h2>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">To reach the collections of icons used in Trunçgil, go to pages <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='styleguide/icons-svg.html'>SVG Icons</a> and <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='styleguide/icons-font.html'>Font Icons</a></p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">To reach the collections of icons used in Trunçgil, go to pages <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='styleguide/icons-svg.html'>SVG Icons</a> and <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='styleguide/icons-font.html'>Font Icons</a></p>
             <div class="card">
               <div class="card-body p-[40px]">
                 <table class="table">
@@ -988,15 +988,15 @@
                   </thead>
                   <tbody>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] my-0 whitespace-nowrap hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://iconscout.com/unicons/explore/line" target="_blank">Font Icons</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] my-0 whitespace-nowrap hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://iconscout.com/unicons/explore/line" target="_blank">Font Icons</a></td>
                       <td>Web’s new favorite icon library, Unicons.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] my-0 whitespace-nowrap hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://www.flaticon.com/authors/monochrome/yellow" target="_blank">SVG Lineal</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] my-0 whitespace-nowrap hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://www.flaticon.com/authors/monochrome/yellow" target="_blank">SVG Lineal</a></td>
                       <td>Monochrome icons from Freepik.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] my-0 whitespace-nowrap hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://www.flaticon.com/authors/pixel-perfect/tritone" target="_blank">SVG Solid</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] my-0 whitespace-nowrap hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://www.flaticon.com/authors/pixel-perfect/tritone" target="_blank">SVG Solid</a></td>
                       <td>Tritone icons from Freepik.</td>
                     </tr>
                   </tbody>
@@ -1008,7 +1008,7 @@
           </section>
           <section id="snippet-4" class="wrapper pt-24">
             <h2 class="!mb-3 !leading-[1.35]">Illustrations</h2>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">To reach the collections of illustrations used in Trunçgil, click <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='styleguide/illustrations.html'>here</a></p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">To reach the collections of illustrations used in Trunçgil, click <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='styleguide/illustrations.html'>here</a></p>
             <div class="card">
               <div class="card-body p-[40px]">
                 <table class="table">
@@ -1020,7 +1020,7 @@
                   </thead>
                   <tbody>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://www.freepik.com/" target="_blank">Freepik</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://www.freepik.com/" target="_blank">Freepik</a></td>
                       <td>Graphic resources for everyone.</td>
                     </tr>
                   </tbody>
@@ -1043,23 +1043,23 @@
                   </thead>
                   <tbody>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://fonts.google.com/specimen/Manrope" target="_blank">Manrope</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://fonts.google.com/specimen/Manrope" target="_blank">Manrope</a></td>
                       <td>Open-source modern font family, designed by Mikhail Sharanda.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/wonderunit/font-thicccboi" target="_blank">Thicccboi</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/wonderunit/font-thicccboi" target="_blank">Thicccboi</a></td>
                       <td>A free and open source font by Wonder Unit.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://fonts.google.com/specimen/DM+Serif+Display" target="_blank">DM Serif</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://fonts.google.com/specimen/DM+Serif+Display" target="_blank">DM Serif</a></td>
                       <td>A high-contrast transitional face, designed by Frank Grießhammer.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://github.com/coreyhu/Urbanist" target="_blank">Urbanist</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://github.com/coreyhu/Urbanist" target="_blank">Urbanist</a></td>
                       <td>A low-contrast, geometric sans-serif inspired by Modernist typography.</td>
                     </tr>
                     <tr>
-                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" href="https://floriankarsten.github.io/space-grotesk/" target="_blank">Space Grotesk</a></td>
+                      <td><a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !bg-[#e0e9fa] !my-0 hover:!text-[#e31e24] hover:after:!text-[#e31e24]" href="https://floriankarsten.github.io/space-grotesk/" target="_blank">Space Grotesk</a></td>
                       <td>A proportional sans-serif typeface variant.</td>
                     </tr>
                   </tbody>
@@ -1093,9 +1093,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/accordion.html b/public/docs/elements/accordion.html
index 89c8e36..caaccee 100644
--- a/public/docs/elements/accordion.html
+++ b/public/docs/elements/accordion.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Background</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Icon</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Background</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Icon</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -666,7 +666,7 @@
                 <div class="accordion accordion-wrapper" id="accordionSimpleExample">
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingSimpleOne">
-                      <button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleOne" aria-expanded="true" aria-controls="collapseSimpleOne"> Professional Design </button>
+                      <button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleOne" aria-expanded="true" aria-controls="collapseSimpleOne"> Professional Design </button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseSimpleOne" class="accordion-collapse collapse show" aria-labelledby="headingSimpleOne" data-bs-parent="#accordionSimpleExample">
@@ -680,7 +680,7 @@
                   <!--/.accordion-item -->
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingSimpleTwo">
-                      <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleTwo" aria-expanded="false" aria-controls="collapseSimpleTwo"> Top-Notch Support </button>
+                      <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleTwo" aria-expanded="false" aria-controls="collapseSimpleTwo"> Top-Notch Support </button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseSimpleTwo" class="accordion-collapse collapse" aria-labelledby="headingSimpleTwo" data-bs-parent="#accordionSimpleExample">
@@ -694,7 +694,7 @@
                   <!--/.accordion-item -->
                   <div class="card plain accordion-item">
                     <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingSimpleThree">
-                      <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleThree" aria-expanded="false" aria-controls="collapseSimpleThree"> Header and Slider Options </button>
+                      <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleThree" aria-expanded="false" aria-controls="collapseSimpleThree"> Header and Slider Options </button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseSimpleThree" class="accordion-collapse collapse" aria-labelledby="headingSimpleThree" data-bs-parent="#accordionSimpleExample">
@@ -721,7 +721,7 @@
                       &#60;div class="accordion accordion-wrapper" id="accordionSimpleExample"&#62;
                         &#60;div class="card plain accordion-item"&#62;
                           &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingSimpleOne"&#62;
-                            &#60;button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleOne" aria-expanded="true" aria-controls="collapseSimpleOne"&#62; Professional Design &#60;/button&#62;
+                            &#60;button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleOne" aria-expanded="true" aria-controls="collapseSimpleOne"&#62; Professional Design &#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseSimpleOne" class="accordion-collapse collapse show" aria-labelledby="headingSimpleOne" data-bs-parent="#accordionSimpleExample"&#62;
@@ -735,7 +735,7 @@
                         &#60;!--/.accordion-item --&#62;
                         &#60;div class="card plain accordion-item"&#62;
                           &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingSimpleTwo"&#62;
-                            &#60;button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleTwo" aria-expanded="false" aria-controls="collapseSimpleTwo"&#62; Top-Notch Support &#60;/button&#62;
+                            &#60;button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleTwo" aria-expanded="false" aria-controls="collapseSimpleTwo"&#62; Top-Notch Support &#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseSimpleTwo" class="accordion-collapse collapse" aria-labelledby="headingSimpleTwo" data-bs-parent="#accordionSimpleExample"&#62;
@@ -749,7 +749,7 @@
                         &#60;!--/.accordion-item --&#62;
                         &#60;div class="card plain accordion-item"&#62;
                           &#60;div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingSimpleThree"&#62;
-                            &#60;button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleThree" aria-expanded="false" aria-controls="collapseSimpleThree"&#62; Header and Slider Options &#60;/button&#62;
+                            &#60;button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseSimpleThree" aria-expanded="false" aria-controls="collapseSimpleThree"&#62; Header and Slider Options &#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseSimpleThree" class="accordion-collapse collapse" aria-labelledby="headingSimpleThree" data-bs-parent="#accordionSimpleExample"&#62;
@@ -779,7 +779,7 @@
                 <div class="accordion accordion-wrapper" id="accordionExample">
                   <div class="card accordion-item !mb-5">
                     <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingOne">
-                      <button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
+                      <button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
@@ -793,7 +793,7 @@
                   <!--/.accordion-item -->
                   <div class="card accordion-item !mb-5">
                     <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingTwo">
-                      <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
+                      <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
@@ -807,7 +807,7 @@
                   <!--/.accordion-item -->
                   <div class="card accordion-item !mb-5">
                     <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingThree">
-                      <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
+                      <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
@@ -834,7 +834,7 @@
                       &#60;div class="accordion accordion-wrapper" id="accordionExample"&#62;
                         &#60;div class="card accordion-item !mb-5"&#62;
                           &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingOne"&#62;
-                            &#60;button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"&#62; Professional Design &#60;/button&#62;
+                            &#60;button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"&#62; Professional Design &#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample"&#62;
@@ -848,7 +848,7 @@
                         &#60;!--/.accordion-item --&#62;
                         &#60;div class="card accordion-item !mb-5"&#62;
                           &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingTwo"&#62;
-                            &#60;button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"&#62; Top-Notch Support &#60;/button&#62;
+                            &#60;button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"&#62; Top-Notch Support &#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample"&#62;
@@ -862,7 +862,7 @@
                         &#60;!--/.accordion-item --&#62;
                         &#60;div class="card accordion-item !mb-5"&#62;
                           &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingThree"&#62;
-                            &#60;button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"&#62; Header and Slider Options &#60;/button&#62;
+                            &#60;button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"&#62; Header and Slider Options &#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample"&#62;
@@ -892,7 +892,7 @@
                 <div class="accordion accordion-wrapper" id="accordionIconExample">
                   <div class="card accordion-item icon !mb-[1.25rem]">
                     <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingIconOne">
-                      <button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseIconOne" aria-expanded="true" aria-controls="collapseIconOne"><span><i class="uil uil-shield-exclamation before:content-['\ecb3']"></i></span>Secure Payments</button>
+                      <button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseIconOne" aria-expanded="true" aria-controls="collapseIconOne"><span><i class="uil uil-shield-exclamation before:content-['\ecb3']"></i></span>Secure Payments</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseIconOne" class="accordion-collapse collapse show" aria-labelledby="headingIconOne" data-bs-parent="#accordionIconExample">
@@ -906,7 +906,7 @@
                   <!--/.accordion-item -->
                   <div class="card accordion-item icon !mb-[1.25rem]">
                     <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingIconTwo">
-                      <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseIconTwo" aria-expanded="false" aria-controls="collapseIconTwo"><span><i class="uil uil-check-circle before:content-['\e9db']"></i></span>Daily Updates</button>
+                      <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseIconTwo" aria-expanded="false" aria-controls="collapseIconTwo"><span><i class="uil uil-check-circle before:content-['\e9db']"></i></span>Daily Updates</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseIconTwo" class="accordion-collapse collapse" aria-labelledby="headingIconTwo" data-bs-parent="#accordionIconExample">
@@ -920,7 +920,7 @@
                   <!--/.accordion-item -->
                   <div class="card accordion-item icon !mb-[1.25rem]">
                     <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingIconThree">
-                      <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseIconThree" aria-expanded="false" aria-controls="collapseIconThree"><span><i class="uil uil-chart-line before:content-['\e9d3']"></i></span>Market Research</button>
+                      <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseIconThree" aria-expanded="false" aria-controls="collapseIconThree"><span><i class="uil uil-chart-line before:content-['\e9d3']"></i></span>Market Research</button>
                     </div>
                     <!--/.card-header -->
                     <div id="collapseIconThree" class="accordion-collapse collapse" aria-labelledby="headingIconThree" data-bs-parent="#accordionIconExample">
@@ -947,7 +947,7 @@
                       &#60;div class="accordion accordion-wrapper" id="accordionIconExample"&#62;
                         &#60;div class="card accordion-item icon !mb-[1.25rem]"&#62;
                           &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingIconOne"&#62;
-                            &#60;button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseIconOne" aria-expanded="true" aria-controls="collapseIconOne"&#62;&#60;span&#62;&#60;i class="uil uil-shield-exclamation before:content-['\ecb3']"&#62;&#60;/i&#62;&#60;/span&#62;Secure Payments&#60;/button&#62;
+                            &#60;button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseIconOne" aria-expanded="true" aria-controls="collapseIconOne"&#62;&#60;span&#62;&#60;i class="uil uil-shield-exclamation before:content-['\ecb3']"&#62;&#60;/i&#62;&#60;/span&#62;Secure Payments&#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseIconOne" class="accordion-collapse collapse show" aria-labelledby="headingIconOne" data-bs-parent="#accordionIconExample"&#62;
@@ -961,7 +961,7 @@
                         &#60;!--/.accordion-item --&#62;
                         &#60;div class="card accordion-item icon !mb-[1.25rem]"&#62;
                           &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingIconTwo"&#62;
-                            &#60;button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseIconTwo" aria-expanded="false" aria-controls="collapseIconTwo"&#62;&#60;span&#62;&#60;i class="uil uil-check-circle before:content-['\e9db']"&#62;&#60;/i&#62;&#60;/span&#62;Daily Updates&#60;/button&#62;
+                            &#60;button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseIconTwo" aria-expanded="false" aria-controls="collapseIconTwo"&#62;&#60;span&#62;&#60;i class="uil uil-check-circle before:content-['\e9db']"&#62;&#60;/i&#62;&#60;/span&#62;Daily Updates&#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseIconTwo" class="accordion-collapse collapse" aria-labelledby="headingIconTwo" data-bs-parent="#accordionIconExample"&#62;
@@ -975,7 +975,7 @@
                         &#60;!--/.accordion-item --&#62;
                         &#60;div class="card accordion-item icon !mb-[1.25rem]"&#62;
                           &#60;div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="headingIconThree"&#62;
-                            &#60;button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseIconThree" aria-expanded="false" aria-controls="collapseIconThree"&#62;&#60;span&#62;&#60;i class="uil uil-chart-line before:content-['\e9d3']"&#62;&#60;/i&#62;&#60;/span&#62;Market Research&#60;/button&#62;
+                            &#60;button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseIconThree" aria-expanded="false" aria-controls="collapseIconThree"&#62;&#60;span&#62;&#60;i class="uil uil-chart-line before:content-['\e9d3']"&#62;&#60;/i&#62;&#60;/span&#62;Market Research&#60;/button&#62;
                           &#60;/div&#62;
                           &#60;!--/.card-header --&#62;
                           &#60;div id="collapseIconThree" class="accordion-collapse collapse" aria-labelledby="headingIconThree" data-bs-parent="#accordionIconExample"&#62;
@@ -1021,9 +1021,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/alerts.html b/public/docs/elements/alerts.html
index e6bfe12..fa7d1bf 100644
--- a/public/docs/elements/alerts.html
+++ b/public/docs/elements/alerts.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,8 +647,8 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Dismissing</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Dismissing</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -775,9 +775,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/animations.html b/public/docs/elements/animations.html
index c4a9a0b..c4c47a5 100644
--- a/public/docs/elements/animations.html
+++ b/public/docs/elements/animations.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -604,11 +604,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -618,13 +618,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -634,33 +634,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -673,12 +673,12 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Standard Example</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Parent Wrap</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Group Wrap</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">[data-duration]</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">[data-interval]</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">[data-delay]</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Standard Example</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Parent Wrap</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Group Wrap</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">[data-duration]</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">[data-interval]</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">[data-delay]</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -943,9 +943,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/avatars.html b/public/docs/elements/avatars.html
index d8c9c72..d326a19 100644
--- a/public/docs/elements/avatars.html
+++ b/public/docs/elements/avatars.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,8 +647,8 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Letters</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Images</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Letters</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Images</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -663,8 +663,8 @@
             <div class="card">
               <div class="card-body flex flex-row items-center p-[40px]">
                 <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[rgba(63,120,224)] opacity-100 !text-white !w-[5rem] !h-[5rem] !mr-4"><span class="xl:!text-[1.5rem] !text-[calc(1.275rem_+_0.3vw)]">TC</span></span>
-                <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[#e0e9fa] !text-[#3f78e0]  w-[3.5rem] h-[3.5rem] !mr-4"><span class="!text-[0.9rem]">AH</span></span>
-                <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[#edf2fc] !text-[#3f78e0]  !w-[2.5rem] !h-[2.5rem] !mr-4"><span class="!text-[.75rem]">CH</span></span>
+                <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[#e0e9fa] !text-[#e31e24]  w-[3.5rem] h-[3.5rem] !mr-4"><span class="!text-[0.9rem]">AH</span></span>
+                <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[#edf2fc] !text-[#e31e24]  !w-[2.5rem] !h-[2.5rem] !mr-4"><span class="!text-[.75rem]">CH</span></span>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -678,11 +678,11 @@
   &lt;span&gt;TC&lt;/span&gt;
 &lt;/span&gt;
 
-&lt;span class=&quot;avatar !bg-[#e0e9fa] !text-[#3f78e0]  w-12 h-12&quot;&gt;
+&lt;span class=&quot;avatar !bg-[#e0e9fa] !text-[#e31e24]  w-12 h-12&quot;&gt;
   &lt;span&gt;AH&lt;/span&gt;
 &lt;/span&gt;
 
-&lt;span class=&quot;avatar !bg-[#edf2fc] !text-[#3f78e0]  !w-[2.5rem] !h-[2.5rem]&quot;&gt;
+&lt;span class=&quot;avatar !bg-[#edf2fc] !text-[#e31e24]  !w-[2.5rem] !h-[2.5rem]&quot;&gt;
   &lt;span&gt;CH&lt;/span&gt;
 &lt;/span&gt;</code></pre>
                   </div>
@@ -749,9 +749,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/background.html b/public/docs/elements/background.html
index 090d7a7..8e61ece 100644
--- a/public/docs/elements/background.html
+++ b/public/docs/elements/background.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,14 +647,14 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-0">Image</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1">Dark</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Gradient</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Color</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Soft</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Pale</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Pattern</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-7">Video</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-0">Image</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1">Dark</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Gradient</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Color</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Soft</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Pale</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Pattern</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-7">Video</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -785,7 +785,7 @@
           <section id="snippet-3" class="wrapper pt-24">
             <h2 class="!mb-3 !leading-[1.35]">Color Background</h2>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium">Available options:</p>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8"><code class="code">bg-[#ffffff]</code>, <code class="code">bg-[#3f78e0]</code>, <code class="code">bg-[#54a8c7]</code>, <code class="code">bg-[#45c4a0]</code>, <code class="code">bg-[#7cb798]</code>, <code class="code">bg-[#343f52]</code>, <code class="code">bg-[#f78b77]</code>, <code class="code">bg-[#d16b86]</code>, <code class="code">bg-[#747ed1]</code>, <code class="code">bg-[#e2626b]</code>, <code class="code">bg-[#a07cc5]</code>, <code class="code">bg-[#fab758]</code>, <code class="code">bg-[#e668b3]</code>, <code class="code">bg-[#5eb9f0]</code>, <code class="code">bg-[#e31e24]</code>.</p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8"><code class="code">bg-[#ffffff]</code>, <code class="code">bg-[#e31e24]</code>, <code class="code">bg-[#54a8c7]</code>, <code class="code">bg-[#45c4a0]</code>, <code class="code">bg-[#7cb798]</code>, <code class="code">bg-[#343f52]</code>, <code class="code">bg-[#f78b77]</code>, <code class="code">bg-[#d16b86]</code>, <code class="code">bg-[#747ed1]</code>, <code class="code">bg-[#e2626b]</code>, <code class="code">bg-[#a07cc5]</code>, <code class="code">bg-[#fab758]</code>, <code class="code">bg-[#e668b3]</code>, <code class="code">bg-[#5eb9f0]</code>, <code class="code">bg-[#e31e24]</code>.</p>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <section class="wrapper !bg-[rgba(63,120,224)] opacity-100 !text-white">
@@ -974,9 +974,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/badges.html b/public/docs/elements/badges.html
index 89edce1..7333bd1 100644
--- a/public/docs/elements/badges.html
+++ b/public/docs/elements/badges.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,10 +647,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Colors</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Gradients</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Shapes</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Sizes</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Colors</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Gradients</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Shapes</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Sizes</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -685,7 +685,7 @@
                 <span class="badge bg-[#f8e7ec] !text-[#d16b86] !rounded-[50rem]">Badge</span>
                 <span class="badge bg-[#f0eaf6] !text-[#a07cc5] !rounded-[50rem]">Badge</span>
                 <span class="badge bg-[#e9eaf8] !text-[#747ed1] !rounded-[50rem]">Badge</span>
-                <span class="badge bg-[#e0e9fa] !text-[#3f78e0] !rounded-[50rem]">Badge</span>
+                <span class="badge bg-[#e0e9fa] !text-[#e31e24] !rounded-[50rem]">Badge</span>
                 <span class="badge bg-[#e4f1f6] !text-[#54a8c7] !rounded-[50rem]">Badge</span>
                 <span class="badge bg-[#e1f6f0] !text-[#45c4a0] !rounded-[50rem]">Badge</span>
                 <span class="badge !bg-[#eaf3ef] !text-[#7cb798] !rounded-[50rem]">Badge</span>
@@ -722,14 +722,14 @@
 
 &lt;span class=&quot;badge bg-[rgba(255,255,255)] opacity-100 !text-[#343f52] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
   
-&lt;span class=&quot;badge !bg-[#e0e9fa] !text-[#3f78e0]  !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
+&lt;span class=&quot;badge !bg-[#e0e9fa] !text-[#e31e24]  !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge !bg-[#fef3e4] !text-[#fab758] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge bg-[#f78b77] !text-[#f78b77] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge !bg-[#fae6e7] !text-[#e2626b] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge bg-[#f8e7ec] !text-[#d16b86] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge bg-[#f0eaf6] !text-[#a07cc5] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge bg-[#e9eaf8] !text-[#747ed1] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
-&lt;span class=&quot;badge bg-[#e0e9fa] !text-[#3f78e0] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
+&lt;span class=&quot;badge bg-[#e0e9fa] !text-[#e31e24] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge bg-[#e4f1f6] !text-[#54a8c7] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge bg-[#e1f6f0] !text-[#45c4a0] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
 &lt;span class=&quot;badge !bg-[#eaf3ef] !text-[#7cb798] !rounded-[50rem]&quot;&gt;Badge&lt;/span&gt;
@@ -861,9 +861,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/buttons.html b/public/docs/elements/buttons.html
index f10c612..d868ad6 100644
--- a/public/docs/elements/buttons.html
+++ b/public/docs/elements/buttons.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,16 +647,16 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#colors">Colors</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#gradients">Gradients</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#sizes">Sizes</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#shapes">Shapes</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#style">Style</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#circle">Circle</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#social">Social</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#icon">Icon</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#expand">Expand</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#play">Play</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#colors">Colors</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#gradients">Gradients</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#sizes">Sizes</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#shapes">Shapes</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#style">Style</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#circle">Circle</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#social">Social</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#icon">Icon</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#expand">Expand</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#play">Play</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -675,7 +675,7 @@
                 <a href="#" class="btn btn-pink !text-white !bg-[#d16b86] border-[#d16b86] hover:text-white hover:bg-[#d16b86] hover:!border-[#d16b86]   active:text-white active:bg-[#d16b86] active:border-[#d16b86] disabled:text-white disabled:bg-[#d16b86] disabled:border-[#d16b86] !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
                 <a href="#" class="btn btn-violet !text-white !bg-[#a07cc5] border-[#a07cc5] hover:text-white hover:bg-[#a07cc5] hover:!border-[#a07cc5]   active:text-white active:bg-[#a07cc5] active:border-[#a07cc5] disabled:text-white disabled:bg-[#a07cc5] disabled:border-[#a07cc5]  !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
                 <a href="#" class="btn btn-purple !text-white !bg-[#747ed1] border-[#747ed1] hover:text-white hover:bg-[#747ed1] hover:!border-[#747ed1]   active:text-white active:bg-[#747ed1] active:border-[#747ed1] disabled:text-white disabled:bg-[#747ed1] disabled:border-[#747ed1] !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
-                <a href="#" class="btn btn-blue !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
+                <a href="#" class="btn btn-blue !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
                 <a href="#" class="btn btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] focus:text-white active:text-white active:bg-[#54a8c7] active:border-[#54a8c7] disabled:text-white disabled:bg-[#54a8c7] disabled:border-[#54a8c7] !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
                 <a href="#" class="btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
                 <a href="#" class="btn btn-leaf !text-white !bg-[#7cb798] border-[#7cb798] hover:text-white hover:bg-[#7cb798] hover:!border-[#7cb798] focus:shadow-[rgba(113,165,142,1)] active:text-white active:bg-[#7cb798] active:border-[#7cb798] disabled:text-white disabled:bg-[#7cb798] disabled:border-[#7cb798] !rounded-[50rem] !mb-2 !mr-[.25rem]">Button</a>
@@ -716,7 +716,7 @@
                       &#60;a href="#" class="btn btn-pink !text-white !bg-[#d16b86] border-[#d16b86] hover:text-white hover:bg-[#d16b86] hover:!border-[#d16b86]   active:text-white active:bg-[#d16b86] active:border-[#d16b86] disabled:text-white disabled:bg-[#d16b86] disabled:border-[#d16b86] !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
                       &#60;a href="#" class="btn btn-violet !text-white !bg-[#a07cc5] border-[#a07cc5] hover:text-white hover:bg-[#a07cc5] hover:!border-[#a07cc5]   active:text-white active:bg-[#a07cc5] active:border-[#a07cc5] disabled:text-white disabled:bg-[#a07cc5] disabled:border-[#a07cc5]  !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
                       &#60;a href="#" class="btn btn-purple !text-white !bg-[#747ed1] border-[#747ed1] hover:text-white hover:bg-[#747ed1] hover:!border-[#747ed1]   active:text-white active:bg-[#747ed1] active:border-[#747ed1] disabled:text-white disabled:bg-[#747ed1] disabled:border-[#747ed1] !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
-                      &#60;a href="#" class="btn btn-blue !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
+                      &#60;a href="#" class="btn btn-blue !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
                       &#60;a href="#" class="btn btn-aqua !text-white !bg-[#54a8c7] border-[#54a8c7] hover:text-white hover:bg-[#54a8c7] hover:!border-[#54a8c7] focus:shadow-[rgba(79,152,181,1)] focus:text-white active:text-white active:bg-[#54a8c7] active:border-[#54a8c7] disabled:text-white disabled:bg-[#54a8c7] disabled:border-[#54a8c7] !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
                       &#60;a href="#" class="btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
                       &#60;a href="#" class="btn btn-leaf !text-white !bg-[#7cb798] border-[#7cb798] hover:text-white hover:bg-[#7cb798] hover:!border-[#7cb798] focus:shadow-[rgba(113,165,142,1)] active:text-white active:bg-[#7cb798] active:border-[#7cb798] disabled:text-white disabled:bg-[#7cb798] disabled:border-[#7cb798] !rounded-[50rem] !mb-2 !mr-[.25rem]"&#62;Button&#60;/a&#62;
@@ -808,9 +808,9 @@
             <h2 class="!mb-5 !leading-[1.35]">Sizes</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-lg !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Large Button</a>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Default Button</a>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-sm !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Small Button</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-lg !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Large Button</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Default Button</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-sm !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Small Button</a>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -820,9 +820,9 @@
               <div id="collapse-sizes" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-lg !rounded-[50rem]"&gt;Large Button&lt;/a&gt; 
-&lt;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]"&gt;Default Button&lt;/a&gt; 
-&lt;a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-sm !rounded-[50rem]"&gt;Small Button&lt;/a&gt;</code></pre>
+                    <pre class="language-html"><code>&lt;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-lg !rounded-[50rem]"&gt;Large Button&lt;/a&gt; 
+&lt;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]"&gt;Default Button&lt;/a&gt; 
+&lt;a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-sm !rounded-[50rem]"&gt;Small Button&lt;/a&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -837,10 +837,10 @@
             <h2 class="!mb-5 !leading-[1.35]">Shapes</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-none !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Square</a>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Rounded</a>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[0.8rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Rounder</a>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Pill</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-none !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Square</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Rounded</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[0.8rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Rounder</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Pill</a>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -850,10 +850,10 @@
               <div id="collapse-shapes" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-none&quot;&gt;Square&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-none&quot;&gt;Square&lt;/a&gt;
 &lt;a href=&quot;#&quot; class=&quot;btn btn-primary&quot;&gt;Rounded&lt;/a&gt;
-&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[0.8rem]&quot;&gt;Rounder&lt;/a&gt;
-&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;&gt;Pill&lt;/a&gt;</code></pre>
+&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[0.8rem]&quot;&gt;Rounder&lt;/a&gt;
+&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;&gt;Pill&lt;/a&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -868,7 +868,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Style</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Solid</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Solid</a>
                 <a href="#" class="btn btn-soft-primary !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Soft</a>
                 <a href="#" class="btn btn-outline-primary !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Outline</a>
                 <a href="#" class="btn btn-gradient gradient-1 !rounded-[50rem] !mr-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0">Gradient</a>
@@ -882,7 +882,7 @@
               <div id="collapse-styles" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot;&gt;Solid&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot;&gt;Solid&lt;/a&gt;
 &lt;a href=&quot;#&quot; class=&quot;btn btn-soft-primary !rounded-[50rem]&quot;&gt;Soft&lt;/a&gt;
 &lt;a href=&quot;#&quot; class=&quot;btn btn-outline-primary !rounded-[50rem]&quot;&gt;Outline&lt;/a&gt;
 &lt;a href=&quot;#&quot; class=&quot;btn btn-gradient gradient-1 !rounded-[50rem] !mr-1 !mb-2 md:!mb-0&quot;&gt;Gradient&lt;/a&gt;
@@ -901,9 +901,9 @@
             <h2 class="!mb-5 !leading-[1.35]">Circle</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-lg xl:!text-[1.3rem] w-[3rem] h-[3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
-                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
-                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-sm w-[1.8rem] h-[1.8rem] !inline-flex !items-center !justify-center !text-[.8rem] !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
+                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-lg xl:!text-[1.3rem] w-[3rem] h-[3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
+                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
+                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-sm w-[1.8rem] h-[1.8rem] !inline-flex !items-center !justify-center !text-[.8rem] !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
                 <a href="#" class="btn btn-circle btn-soft-primary btn-lg xl:!text-[1.3rem] w-[3rem] h-[3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
                 <a href="#" class="btn btn-circle btn-soft-primary w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
                 <a href="#" class="btn btn-circle btn-soft-primary btn-sm w-[1.8rem] h-[1.8rem] !inline-flex !items-center !justify-center !text-[.8rem] !leading-none !p-0 !rounded-[100%] !mr-2 !mb-2"><i class="uil uil-check before:content-['\e9dd']"></i></a>
@@ -926,9 +926,9 @@
               <div id="collapse-circle" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-lg&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-lg&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
 &lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-primary&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
-&lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-sm&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
+&lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-sm&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
 
 &lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-soft-primary btn-lg&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
 &lt;a href=&quot;#&quot; class=&quot;btn btn-circle btn-soft-primary&quot;&gt;&lt;i class=&quot;uil uil-check&quot;&gt;&lt;/i&gt;&lt;/a&gt;
@@ -1025,8 +1025,8 @@
             <h2 class="!mb-5 !leading-[1.35]">Icon</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !mr-2"><i class="uil uil-apple !mr-[.3rem] before:content-['\e938']"></i> App Store</a>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end rounded">Google Play <i class="uil uil-google-play !mr-[.3rem] before:content-['\eb4f']"></i></a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !mr-2"><i class="uil uil-apple !mr-[.3rem] before:content-['\e938']"></i> App Store</a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end rounded">Google Play <i class="uil uil-google-play !mr-[.3rem] before:content-['\eb4f']"></i></a>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -1036,11 +1036,11 @@
               <div id="collapse-icon" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded&quot;&gt;
+                    <pre class="language-html"><code>&lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded&quot;&gt;
  &lt;i class=&quot;uil uil-apple&quot;&gt;&lt;/i&gt; App Store
 &lt;/a&gt;
 
-&lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-end rounded&quot;&gt;
+&lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-end rounded&quot;&gt;
  Google Play &lt;i class=&quot;uil uil-google-play&quot;&gt;&lt;/i&gt;
 &lt;/a&gt;</code></pre>
                   </div>
@@ -1056,7 +1056,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Expand</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-expand btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-5 !mb-3 xl:!mb-0 lg:!mb-0"><i class="uil uil-arrow-right before:content-['\e94c']"></i><span>Learn More</span></a>
+                <a href="#" class="btn btn-expand btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-5 !mb-3 xl:!mb-0 lg:!mb-0"><i class="uil uil-arrow-right before:content-['\e94c']"></i><span>Learn More</span></a>
                 <br class="xl:!hidden lg:!hidden">
                 <a href="#" class="btn btn-expand btn-soft-primary !rounded-[50rem] !mr-5"><i class="uil uil-arrow-right before:content-['\e94c']"></i><span>Learn More</span></a>
               </div>
@@ -1069,7 +1069,7 @@
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
                     <pre class="language-html"><code>
-                      &#60;a href="#" class="btn btn-expand btn-primary !text-white bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-5 !mb-3 xl:!mb-0 lg:!mb-0"&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c']"&#62;&#60;/i&#62;&#60;span&#62;Learn More&#60;/span&#62;&#60;/a&#62;
+                      &#60;a href="#" class="btn btn-expand btn-primary !text-white bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-5 !mb-3 xl:!mb-0 lg:!mb-0"&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c']"&#62;&#60;/i&#62;&#60;span&#62;Learn More&#60;/span&#62;&#60;/a&#62;
                       &#60;br class="xl:!hidden lg:!hidden"&#62;
                       &#60;a href="#" class="btn btn-expand btn-soft-primary !rounded-[50rem] !mr-5"&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c']"&#62;&#60;/i&#62;&#60;span&#62;Learn More&#60;/span&#62;&#60;/a&#62;</code></pre>
                   </div>
@@ -1085,7 +1085,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Play</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mr-5 xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !translate-y-0 !tracking-[-0.01rem] !relative before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#3f78e0] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#3f78e0] after:[animation-delay:.5s]"><i class="icn-caret-right"></i></a>
+                <a href="#" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mr-5 xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !translate-y-0 !tracking-[-0.01rem] !relative before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e31e24] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e31e24] after:[animation-delay:.5s]"><i class="icn-caret-right"></i></a>
                 <a href="#" class="btn btn-circle btn-soft-primary btn-play ripple xl:!text-[2.3rem] w-[3.5rem] h-[3.5rem] !text-[calc(1.355rem_+_1.26vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !translate-y-0 !tracking-[-0.01rem] !relative before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e0e9fa] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e0e9fa] after:[animation-delay:.5s]"><i class="icn-caret-right"></i></a>
               </div>
               <!--/.card-body -->
@@ -1096,7 +1096,7 @@
               <div id="collapse-play" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href="#" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mr-5 xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !translate-y-0 !tracking-[-0.01rem] !relative before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#3f78e0] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#3f78e0] after:[animation-delay:.5s]"&gt;&lt;i class="icn-caret-right"&gt;&lt;/i&gt;&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href="#" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mr-5 xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !translate-y-0 !tracking-[-0.01rem] !relative before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e31e24] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e31e24] after:[animation-delay:.5s]"&gt;&lt;i class="icn-caret-right"&gt;&lt;/i&gt;&lt;/a&gt;
                     &lt;a href="#" class="btn btn-circle btn-soft-primary btn-play ripple xl:!text-[2.3rem] w-[3.5rem] h-[3.5rem] !text-[calc(1.355rem_+_1.26vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] !translate-y-0 !tracking-[-0.01rem] !relative before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e0e9fa] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e0e9fa] after:[animation-delay:.5s]"&gt;&lt;i class="icn-caret-right"&gt;&lt;/i&gt;&lt;/a&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
@@ -1131,9 +1131,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/card.html b/public/docs/elements/card.html
index 70f5e39..37b8c7f 100644
--- a/public/docs/elements/card.html
+++ b/public/docs/elements/card.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,10 +647,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Basic</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Color</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Border</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Image</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Basic</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Color</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Border</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Image</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -820,7 +820,7 @@
           <section id="snippet-3" class="wrapper pt-24">
             <h2 class="!mb-3 !leading-[1.35]">Border</h2>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium">Available options:</p>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8"><code class="code">border-[#3f78e0]</code>, <code class="code">border-[#54a8c7]</code>, <code class="code">border-[#45c4a0]</code>, <code class="code">border-[#7cb798]</code>, <code class="code">border-[#343f52]</code>, <code class="code">border-[#f78b77]</code>, <code class="code">border-[#d16b86]</code>, <code class="code">border-[#747ed1]</code>, <code class="code">border-[#e2626b]</code>, <code class="code">border-[#a07cc5]</code>, <code class="code">border-[#fab758]</code>, <code class="code">border-[#e668b3]</code>, <code class="code">border-[#5eb9f0]</code>, <code class="code">border-[#e31e24]</code>, <code class="code">border-[#c5d7f6]</code>, <code class="code">border-[#cce5ee]</code>, <code class="code">border-[#c7ede3]</code>, <code class="code">border-[#d8e9e0]</code>, <code class="code">border-[#c2c5cb]</code>, <code class="code">border-[#fddcd6]</code>, <code class="code">border-[#f1d3db]</code>, <code class="code">border-[#d5d8f1]</code>, <code class="code">border-[#f6d0d3]</code>, <code class="code">border-[#e3d8ee]</code>, <code class="code">border-[#fee9cd]</code>, <code class="code">border-[#f8d2e8]</code>, <code class="code">border-[#cfeafb]</code>, <code class="code">border-[#cfceea]</code>.</p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8"><code class="code">border-[#e31e24]</code>, <code class="code">border-[#54a8c7]</code>, <code class="code">border-[#45c4a0]</code>, <code class="code">border-[#7cb798]</code>, <code class="code">border-[#343f52]</code>, <code class="code">border-[#f78b77]</code>, <code class="code">border-[#d16b86]</code>, <code class="code">border-[#747ed1]</code>, <code class="code">border-[#e2626b]</code>, <code class="code">border-[#a07cc5]</code>, <code class="code">border-[#fab758]</code>, <code class="code">border-[#e668b3]</code>, <code class="code">border-[#5eb9f0]</code>, <code class="code">border-[#e31e24]</code>, <code class="code">border-[#c5d7f6]</code>, <code class="code">border-[#cce5ee]</code>, <code class="code">border-[#c7ede3]</code>, <code class="code">border-[#d8e9e0]</code>, <code class="code">border-[#c2c5cb]</code>, <code class="code">border-[#fddcd6]</code>, <code class="code">border-[#f1d3db]</code>, <code class="code">border-[#d5d8f1]</code>, <code class="code">border-[#f6d0d3]</code>, <code class="code">border-[#e3d8ee]</code>, <code class="code">border-[#fee9cd]</code>, <code class="code">border-[#f8d2e8]</code>, <code class="code">border-[#cfeafb]</code>, <code class="code">border-[#cfceea]</code>.</p>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <div class="flex flex-wrap mx-[-15px] g-6 !mt-[-30px]">
@@ -879,11 +879,11 @@
               <div id="collapse-3" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;div class=&quot;card card-border-start border-[#3f78e0]&quot;&gt;
+                    <pre class="language-html"><code>&lt;div class=&quot;card card-border-start border-[#e31e24]&quot;&gt;
   &lt;div class=&quot;card-body&quot;&gt;...&lt;/div&gt;
 &lt;/div&gt;
 
-&lt;div class=&quot;card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] card-border-top border-[#3f78e0]&quot;&gt;
+&lt;div class=&quot;card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] card-border-top border-[#e31e24]&quot;&gt;
   &lt;div class=&quot;card-body&quot;&gt;...&lt;/div&gt;
 &lt;/div&gt;
 
@@ -891,7 +891,7 @@
   &lt;div class=&quot;card-body&quot;&gt;...&lt;/div&gt;
 &lt;/div&gt;
 
-&lt;div class=&quot;card !bg-[#edf2fc] card-border-bottom border-[#3f78e0]&quot;&gt;
+&lt;div class=&quot;card !bg-[#edf2fc] card-border-bottom border-[#e31e24]&quot;&gt;
   &lt;div class=&quot;card-body&quot;&gt;...&lt;/div&gt;
 &lt;/div&gt;</code></pre>
                   </div>
@@ -993,9 +993,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/carousel.html b/public/docs/elements/carousel.html
index 768befd..afa4628 100644
--- a/public/docs/elements/carousel.html
+++ b/public/docs/elements/carousel.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,12 +647,12 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple Carousel</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Card Carousel</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Text Slider</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Image Slider</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Thumbnail Slider</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#instructions">Instructions</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple Carousel</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Card Carousel</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Text Slider</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Image Slider</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Thumbnail Slider</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#instructions">Instructions</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -997,8 +997,8 @@
             <h2 class="!mb-3 !leading-[1.35]">Image Slider</h2>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium">Remove <code class="code">.dots-over</code> class to move bullets below the images.</p>
             <p class="lead !mb-3">Use any available <code class="code">.m-*</code>, <code class="code">.p-*</code>, <code class="code">.bg-*</code> and <code class="code">.text-*</code> helper class to style and place the captions. You can change their placement with the help of flex classes as well.</p>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium">Use <a href="https://animate.style/" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">animate.css</a> animation and utility classes to add animations and delays to captions.</p>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">For hero slider (slider with fixed height and background cover images) with captions example check out <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo15.html' target='_blank'>Demo 15</a></p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium">Use <a href="https://animate.style/" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">animate.css</a> animation and utility classes to add animations and delays to captions.</p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">For hero slider (slider with fixed height and background cover images) with captions example check out <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo15.html' target='_blank'>Demo 15</a></p>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <div class="swiper-container dots-over relative !z-10" data-margin="5" data-dots="true" data-nav="true" data-autoheight="true">
@@ -1320,11 +1320,11 @@
                   <tbody>
                     <tr>
                       <td class="!pl-0"><code class="code my-0">.swiper-hero</code></td>
-                      <td>Enables hero slider, ie: <a class='external !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='../../demo15.html' target='_blank'>Demo 15</a></td>
+                      <td>Enables hero slider, ie: <a class='external !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='../../demo15.html' target='_blank'>Demo 15</a></td>
                     </tr>
                     <tr>
                       <td class="!pl-0"><code class="code my-0">.swiper-fullscreen</code></td>
-                      <td>Enables fullscreen slider, ie: <a class='external !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='../../demo23.html' target='_blank'>Demo 23</a></td>
+                      <td>Enables fullscreen slider, ie: <a class='external !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='../../demo23.html' target='_blank'>Demo 23</a></td>
                     </tr>
                     <tr>
                       <td class="!pl-0"><code class="code my-0">.nav-dark</code></td>
@@ -1361,7 +1361,7 @@
                   </tbody>
                 </table>
                 <h4>Full examples</h4>
-                <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/blog.html' target='_blank'>Blog Blocks</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/testimonials.html' target='_blank'>Testimonials Blocks</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/portfolio.html' target='_blank'>Portfolio Blocks</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/clients.html' target='_blank'>Client Blocks</a>
+                <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/blog.html' target='_blank'>Blog Blocks</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/testimonials.html' target='_blank'>Testimonials Blocks</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/portfolio.html' target='_blank'>Portfolio Blocks</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../blocks/clients.html' target='_blank'>Client Blocks</a>
               </div>
               <!--/.card-body -->
             </div>
@@ -1391,9 +1391,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/dividers.html b/public/docs/elements/dividers.html
index 9691a3c..2a610c9 100644
--- a/public/docs/elements/dividers.html
+++ b/public/docs/elements/dividers.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,10 +647,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Borders</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Angles</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Waves</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Vertical</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Borders</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Angles</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Waves</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Vertical</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -1010,9 +1010,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/form-elements.html b/public/docs/elements/form-elements.html
index af8328b..f88d759 100644
--- a/public/docs/elements/form-elements.html
+++ b/public/docs/elements/form-elements.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,12 +647,12 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Input</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Textarea</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Checks</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Radios</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Disabled</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Select</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Input</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Textarea</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Checks</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Radios</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Disabled</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Select</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -901,9 +901,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/image-hover.html b/public/docs/elements/image-hover.html
index 4fc1bc4..b907cb4 100644
--- a/public/docs/elements/image-hover.html
+++ b/public/docs/elements/image-hover.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,10 +647,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Tooltip</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Overlay</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Simple</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Cursor</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Tooltip</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Overlay</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Simple</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Cursor</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -873,9 +873,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/image-mask.html b/public/docs/elements/image-mask.html
index 65b8a52..25ac5ee 100644
--- a/public/docs/elements/image-mask.html
+++ b/public/docs/elements/image-mask.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Mask 1</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Mask 2</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Mask 3</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Mask 1</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Mask 2</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Mask 3</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -772,9 +772,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/lightbox.html b/public/docs/elements/lightbox.html
index 2f1d683..e28a1ae 100644
--- a/public/docs/elements/lightbox.html
+++ b/public/docs/elements/lightbox.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#instructions">Instructions</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1">Image & Caption</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Video</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#instructions">Instructions</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1">Image & Caption</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Video</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -822,9 +822,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/modal.html b/public/docs/elements/modal.html
index 3a6d518..4d89417 100644
--- a/public/docs/elements/modal.html
+++ b/public/docs/elements/modal.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,11 +647,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Cookie</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Subscription</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Sign In</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Sign Up</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Popup</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Cookie</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Subscription</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Sign In</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Sign Up</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Popup</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -664,7 +664,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Cookie</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-01">Cookie</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-01">Cookie</a>
                 <div class="modal fade modal-bottom-center !m-0 !p-0" id="modal-01" tabindex="-1">
                   <div class="modal-dialog modal-xl lg:!w-[800px] xl:!w-[1140px] lg:!max-w-[800px] xl:!max-w-[1140px]">
                     <div class="modal-content">
@@ -676,7 +676,7 @@
                           </div>
                           <!--/column -->
                           <div class="md:w-5/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full  xl:!text-right lg:!text-right my-auto">
-                            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-dismiss="modal" aria-label="Close">I Understand</a>
+                            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-dismiss="modal" aria-label="Close">I Understand</a>
                           </div>
                           <!--/column -->
                         </div>
@@ -698,7 +698,7 @@
               <div id="collapse-1" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-01&quot;&gt;Cookie&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-01&quot;&gt;Cookie&lt;/a&gt;
   
 &lt;div class=&quot;modal fade modal-bottom-center&quot; id=&quot;modal-01&quot; tabindex=&quot;-1&quot;&gt;
   &lt;div class=&quot;modal-dialog modal-xl&quot;&gt;
@@ -711,7 +711,7 @@
           &lt;/div&gt;
           &lt;!--/column --&gt;
           &lt;div class=&quot;md:w-5/12 flex-[0_0_auto] !px-[15px] max-w-full lg:w-4/12 flex-[0_0_auto] !px-[15px] max-w-full  xl:!text-right lg:!text-right my-auto&quot;&gt;
-            &lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]&quot; data-bs-dismiss=&quot;modal&quot; aria-label=&quot;Close&quot;&gt;I Understand&lt;/a&gt;
+            &lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]&quot; data-bs-dismiss=&quot;modal&quot; aria-label=&quot;Close&quot;&gt;I Understand&lt;/a&gt;
           &lt;/div&gt;
           &lt;!--/column --&gt;
         &lt;/div&gt;
@@ -737,7 +737,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Subscription</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-02">Subscription</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-02">Subscription</a>
                 <div class="modal fade !m-0 !p-0" id="modal-02" tabindex="-1">
                   <div class="modal-dialog modal-dialog-centered modal-md">
                     <div class="modal-content !text-center">
@@ -762,7 +762,7 @@
                                     <div class="!text-left input-group !relative form-floating">
                                       <input type="email" value="" name="EMAIL" class="required email form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL">
                                       <label for="mce-EMAIL" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Email Address</label>
-                                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]">
+                                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]">
                                     </div>
                                     <div id="mce-responses" class="clear">
                                       <div class="response" id="mce-error-response" style="display:none"></div>
@@ -797,7 +797,7 @@
               <div id="collapse-2" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-02&quot;&gt;Subscription&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-02&quot;&gt;Subscription&lt;/a&gt;
   
 &lt;div class=&quot;modal fade&quot; id=&quot;modal-02&quot; tabindex=&quot;-1&quot;&gt;
   &lt;div class=&quot;modal-dialog modal-dialog-centered modal-md&quot;&gt;
@@ -862,7 +862,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Sign In</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-signin">Sign In</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-signin">Sign In</a>
                 <div class="modal fade !m-0 !p-0" id="modal-signin" tabindex="-1">
                   <div class="modal-dialog modal-dialog-centered modal-sm">
                     <div class="modal-content !text-center">
@@ -880,7 +880,7 @@
                             <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                             <label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
                           </div>
-                          <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                          <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                         </form>
                         <!-- /form -->
                         <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -926,7 +926,7 @@
                             <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                             <label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
                           </div>
-                          <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                          <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                         </form>
                         <!-- /form -->
                         <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -954,7 +954,7 @@
               <div id="collapse-3" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-signin&quot;&gt;Sign In&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-signin&quot;&gt;Sign In&lt;/a&gt;
 
 &lt;div class=&quot;modal fade&quot; id=&quot;modal-signin&quot; tabindex=&quot;-1&quot;&gt;
   &lt;div class=&quot;modal-dialog modal-dialog-centered modal-sm&quot;&gt;
@@ -973,7 +973,7 @@
             &lt;span class=&quot;password-toggle&quot;&gt;&lt;i class=&quot;uil uil-eye&quot;&gt;&lt;/i&gt;&lt;/span&gt;
             &lt;label for=&quot;loginPassword&quot;&gt;Password&lt;/label&gt;
           &lt;/div&gt;
-          &lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2&quot;&gt;Sign In&lt;/a&gt;
+          &lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2&quot;&gt;Sign In&lt;/a&gt;
         &lt;/form&gt;
         &lt;!-- /form --&gt;
         &lt;p class=&quot;mb-1&quot;&gt;&lt;a href=&quot;#&quot; class=&quot;hover&quot;&gt;Forgot Password?&lt;/a&gt;&lt;/p&gt;
@@ -1006,7 +1006,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Sign Up</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-signup">Sign Up</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 xl:!mb-0 lg:!mb-0 md:!mb-0" data-bs-toggle="modal" data-bs-target="#modal-signup">Sign Up</a>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -1016,7 +1016,7 @@
               <div id="collapse-4" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-signup&quot;&gt;Sign Up&lt;/a&gt;
+                    <pre class="language-html"><code>&lt;a href=&quot;#&quot; class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] mx-1 !mb-2 md:!mb-0&quot; data-bs-toggle=&quot;modal&quot; data-bs-target=&quot;#modal-signup&quot;&gt;Sign Up&lt;/a&gt;
   
 &lt;div class=&quot;modal fade&quot; id=&quot;modal-signup&quot; tabindex=&quot;-1&quot;&gt;
   &lt;div class=&quot;modal-dialog modal-dialog-centered modal-sm&quot;&gt;
@@ -1044,7 +1044,7 @@
             &lt;span class=&quot;password-toggle&quot;&gt;&lt;i class=&quot;uil uil-eye&quot;&gt;&lt;/i&gt;&lt;/span&gt;
             &lt;label for=&quot;loginPasswordConfirm&quot;&gt;Confirm Password&lt;/label&gt;
           &lt;/div&gt;
-          &lt;a class=&quot;btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2&quot;&gt;Sign Up&lt;/a&gt;
+          &lt;a class=&quot;btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2&quot;&gt;Sign Up&lt;/a&gt;
         &lt;/form&gt;
         &lt;!-- /form --&gt;
         &lt;p class=&quot;mb-0&quot;&gt;Already have an account? &lt;a href=&quot;#&quot; data-bs-target=&quot;#modal-signin&quot; data-bs-toggle=&quot;modal&quot; data-bs-dismiss=&quot;modal&quot; class=&quot;hover&quot;&gt;Sign in&lt;/a&gt;&lt;/p&gt;
@@ -1075,7 +1075,7 @@
           <section id="snippet-5" class="wrapper py-24">
             <h2 class="!mb-3 !leading-[1.35]">Popup</h2>
             <p class="lead !mb-1">To display any modal as a popup on your page, add <code class="code">.modal-popup</code> class to your <code class="code">.modal</code>.</p>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">Check out a live example: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo12.html' target='_blank'>Demo 12</a>.</p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">Check out a live example: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo12.html' target='_blank'>Demo 12</a>.</p>
             <div class="card">
               <div class="card-footer !relative border-0">
                 <a class="collapse-link collapsed stretched-link" data-bs-toggle="collapse" href="#collapse-5">View example's code</a>
@@ -1121,9 +1121,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/pagination.html b/public/docs/elements/pagination.html
index 28921a7..51e83ed 100644
--- a/public/docs/elements/pagination.html
+++ b/public/docs/elements/pagination.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Default</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Alternative</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Breadcrumb</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Default</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Alternative</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Breadcrumb</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -789,14 +789,14 @@
                 </nav>
                 <nav aria-label="breadcrumb">
                   <ol class="breadcrumb flex flex-wrap !mb-4 p-0 rounded-none">
-                    <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+                    <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
                     <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Library</li>
                   </ol>
                 </nav>
                 <nav aria-label="breadcrumb">
                   <ol class="breadcrumb flex flex-wrap !mb-4 p-0 rounded-none">
-                    <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
-                    <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Library</a></li>
+                    <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
+                    <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Library</a></li>
                     <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Data</li>
                   </ol>
                 </nav>
@@ -877,9 +877,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/player.html b/public/docs/elements/player.html
index ee12269..8ef16c0 100644
--- a/public/docs/elements/player.html
+++ b/public/docs/elements/player.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,10 +647,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">HTML5 Video - plyr</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Vimeo - plyr</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">YouTube - plyr</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Embed</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">HTML5 Video - plyr</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Vimeo - plyr</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">YouTube - plyr</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Embed</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -789,9 +789,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/progressbar.html b/public/docs/elements/progressbar.html
index 56a62db..acba447 100644
--- a/public/docs/elements/progressbar.html
+++ b/public/docs/elements/progressbar.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,8 +647,8 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Line</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Semi Circle</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Line</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Semi Circle</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -836,9 +836,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/shadows.html b/public/docs/elements/shadows.html
index 53b9d00..32357ac 100644
--- a/public/docs/elements/shadows.html
+++ b/public/docs/elements/shadows.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -699,9 +699,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/shapes.html b/public/docs/elements/shapes.html
index 49664ac..19dd678 100644
--- a/public/docs/elements/shapes.html
+++ b/public/docs/elements/shapes.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,11 +647,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Dot</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Line</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Solid</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">SVG</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Doodles</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Dot</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Line</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Solid</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">SVG</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Doodles</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -670,7 +670,7 @@
                   </div>
                   <!-- /column -->
                   <div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                    <div class="shape bg-dot opacity-50 blue !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]"></div>
+                    <div class="shape bg-dot opacity-50 blue !w-[8rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]"></div>
                   </div>
                   <!-- /column -->
                   <div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
@@ -695,7 +695,7 @@
                     <pre class="language-html"><code>
                       &#60;div class="shape bg-dot opacity-50 yellow !w-[8rem] !h-[8rem] bg-[radial-gradient(#fab758_2px,transparent_2.5px)]"&#62;&#60;/div&#62;
   
-                      &#60;div class="shape bg-dot opacity-50 blue !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]"&#62;&#60;/div&#62;
+                      &#60;div class="shape bg-dot opacity-50 blue !w-[8rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]"&#62;&#60;/div&#62;
   
                       &#60;div class="shape bg-dot opacity-50 red !w-[8rem] !h-[8rem] bg-[radial-gradient(#e2626b_2px,transparent_2.5px)]"&#62;&#60;/div&#62;
   
@@ -784,7 +784,7 @@
           </section>
           <section id="snippet-3" class="wrapper pt-24">
             <h2 class="!mb-3 !leading-[1.35]">Solid</h2>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">All background color options (<a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='background.html#snippet-3'>solid</a>, <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='background.html#snippet-4'>soft</a>, <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='background.html#snippet-5'>pale</a>) are available to use.</p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">All background color options (<a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='background.html#snippet-3'>solid</a>, <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='background.html#snippet-4'>soft</a>, <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='background.html#snippet-5'>pale</a>) are available to use.</p>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <div class="flex flex-wrap mx-[-15px] g-6 !mt-[-30px]">
@@ -1074,9 +1074,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/tables.html b/public/docs/elements/tables.html
index cc4458d..f95ed14 100644
--- a/public/docs/elements/tables.html
+++ b/public/docs/elements/tables.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,13 +647,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Simple Dark</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Striped</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Bordered</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Borderless</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Hoverable</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-7">Responsive</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Simple</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Simple Dark</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Striped</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Bordered</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Borderless</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Hoverable</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-7">Responsive</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -1094,9 +1094,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/tabs.html b/public/docs/elements/tabs.html
index fb3088c..7636b25 100644
--- a/public/docs/elements/tabs.html
+++ b/public/docs/elements/tabs.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Basic</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Pills</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Justified</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Basic</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Pills</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Justified</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -673,10 +673,10 @@
                     <p>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Vestibulum id ligula porta felis euismod semper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
                     <p>Donec sed odio dui. Donec sed odio dui. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum.</p>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
                     </ul>
                   </div>
                   <!--/.tab-pane -->
@@ -747,10 +747,10 @@
                     <p>Aenean lacinia bibendum nulla sed consectetur. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Vestibulum id ligula porta felis euismod semper. Lorem ipsum dolor sit amet, consectetur adipiscing elit. </p>
                     <p>Donec sed odio dui. Donec sed odio dui. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Maecenas faucibus mollis interdum.</p>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
                     </ul>
                   </div>
                   <!--/.tab-pane -->
@@ -824,7 +824,7 @@
           </section>
           <section id="snippet-3" class="wrapper py-24">
             <h2 class="!mb-3 !leading-[1.35]">Justified</h2>
-            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">Check out a live example: <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo9.html' target='_blank'>Demo 9</a>.</p>
+            <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-8">Check out a live example: <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo9.html' target='_blank'>Demo 9</a>.</p>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <ul class="nav nav-tabs nav-tabs-bg nav-tabs-shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] flex justify-between nav-justified xl:!flex-row lg:!flex-row flex-col">
@@ -929,9 +929,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/text-animations.html b/public/docs/elements/text-animations.html
index 86e1165..4069236 100644
--- a/public/docs/elements/text-animations.html
+++ b/public/docs/elements/text-animations.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Typer</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Typer with Loop</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Rotator</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Typer</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Typer with Loop</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Rotator</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -664,7 +664,7 @@
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <div class="flex flex-wrap mx-[-15px]">
                   <div class="xl:w-9/12 lg:w-9/12 md:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
-                    <h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]  !mb-0">Trunçgil is effortless and powerful with <br><span class="typer !text-[#3f78e0] " data-loop="false" data-delay="100" data-words="easy usage,fast transactions,secure payments"></span><span class="cursor !text-[#3f78e0] " data-owner="typer"></span></h2>
+                    <h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]  !mb-0">Trunçgil is effortless and powerful with <br><span class="typer !text-[#e31e24] " data-loop="false" data-delay="100" data-words="easy usage,fast transactions,secure payments"></span><span class="cursor !text-[#e31e24] " data-owner="typer"></span></h2>
                   </div>
                   <!-- /column -->
                 </div>
@@ -678,11 +678,11 @@
               <div id="collapse-1" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;span class=&quot;typer !text-[#3f78e0] &quot; 
+                    <pre class="language-html"><code>&lt;span class=&quot;typer !text-[#e31e24] &quot; 
       data-loop=&quot;false&quot; 
       data-delay=&quot;100&quot; 
       data-words=&quot;easy usage,fast transactions,secure payments&quot;&gt;
-&lt;/span&gt;&lt;span class=&quot;cursor !text-[#3f78e0] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;</code></pre>
+&lt;/span&gt;&lt;span class=&quot;cursor !text-[#e31e24] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -698,7 +698,7 @@
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <div class="flex flex-wrap mx-[-15px]">
                   <div class="lg:w-9/12 flex-[0_0_auto] !px-[15px] max-w-full">
-                    <h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]  !mb-0">Trunçgil focuses on <br><span class="typer !text-[#3f78e0] " data-delay="100" data-words="customer satisfaction,business needs,creative ideas"></span><span class="cursor !text-[#3f78e0] " data-owner="typer"></span></h2>
+                    <h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]  !mb-0">Trunçgil focuses on <br><span class="typer !text-[#e31e24] " data-delay="100" data-words="customer satisfaction,business needs,creative ideas"></span><span class="cursor !text-[#e31e24] " data-owner="typer"></span></h2>
                   </div>
                   <!-- /column -->
                 </div>
@@ -712,10 +712,10 @@
               <div id="collapse-2" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;span class=&quot;typer !text-[#3f78e0] &quot; 
+                    <pre class="language-html"><code>&lt;span class=&quot;typer !text-[#e31e24] &quot; 
       data-delay=&quot;100&quot; 
       data-words=&quot;customer satisfaction,business needs,creative ideas&quot;&gt;
-&lt;/span&gt;&lt;span class=&quot;cursor !text-[#3f78e0] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;</code></pre>
+&lt;/span&gt;&lt;span class=&quot;cursor !text-[#e31e24] &quot; data-owner=&quot;typer&quot;&gt;&lt;/span&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -731,7 +731,7 @@
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <div class="flex flex-wrap mx-[-15px]">
                   <div class="xl:w-9/12 lg:w-9/12 md:w-9/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
-                    <h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]  !mb-0">Trunçgil is effortless and powerful with <span class="rotator-fade !text-[#3f78e0] ">easy usage,fast transactions,secure payments</span></h2>
+                    <h2 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]  !mb-0">Trunçgil is effortless and powerful with <span class="rotator-fade !text-[#e31e24] ">easy usage,fast transactions,secure payments</span></h2>
                   </div>
                   <!-- /column -->
                 </div>
@@ -745,9 +745,9 @@
               <div id="collapse-3" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;span class=&quot;rotator-fade !text-[#3f78e0] &quot;&gt;easy usage,fast transactions,secure payments&lt;/span&gt;
+                    <pre class="language-html"><code>&lt;span class=&quot;rotator-fade !text-[#e31e24] &quot;&gt;easy usage,fast transactions,secure payments&lt;/span&gt;
 
-&lt;span class=&quot;rotator-zoom !text-[#3f78e0] &quot;&gt;easy usage,fast transactions,secure payments&lt;/span&gt;
+&lt;span class=&quot;rotator-zoom !text-[#e31e24] &quot;&gt;easy usage,fast transactions,secure payments&lt;/span&gt;
 </code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
@@ -782,9 +782,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/text-highlight.html b/public/docs/elements/text-highlight.html
index 845b531..4c531ce 100644
--- a/public/docs/elements/text-highlight.html
+++ b/public/docs/elements/text-highlight.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,10 +647,10 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Underline</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Underline 2</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Underline 3</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Mark</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Underline</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Underline 2</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Underline 3</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Mark</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -704,7 +704,7 @@
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
                 <h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold xl:!text-[2rem] !leading-[1.35] !mb-4">Build and manage an <span class="yellow relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-[ease-in-out] after:!mt-0 after:rounded-[5rem] after:bottom-[4%] after:bg-[#fab758]">impressive</span> website with Trunçgil in no time.</h2>
-                <h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold xl:!text-[2rem] !leading-[1.35]  !mb-0">Build and manage an <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] after:!bg-[linear-gradient(40deg,#f5b161_.4%,#ec366e_100.2%)]">impressive</span> website with Trunçgil in no time.</h2>
+                <h2 class="!text-[calc(1.325rem_+_0.9vw)] font-bold xl:!text-[2rem] !leading-[1.35]  !mb-0">Build and manage an <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] after:!bg-[linear-gradient(40deg,#f5b161_.4%,#ec366e_100.2%)]">impressive</span> website with Trunçgil in no time.</h2>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -714,29 +714,29 @@
               <div id="collapse-2" class="card-footer  !bg-[#21262c] opacity-100  !p-0 accordion-collapse collapse">
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
-                    <pre class="language-html"><code>&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] yellow&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] orange&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] red&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] pink&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] violet&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] purple&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] blue&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] aqua&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] green&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] leaf&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] fuchsia&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] sky&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] grape&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] navy&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] ash&quot;&gt;text&lt;/span&gt;
+                    <pre class="language-html"><code>&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] yellow&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] orange&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] red&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] pink&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] violet&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] purple&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] blue&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] aqua&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] green&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] leaf&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] fuchsia&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] sky&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] grape&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] navy&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] ash&quot;&gt;text&lt;/span&gt;
   
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] after:!bg-[linear-gradient(120deg,#f857a6_10%,#ef3f6e_100%)]&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-2&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-3&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-4&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-5&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-6&quot;&gt;text&lt;/span&gt;
-&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] underline-gradient-7&quot;&gt;text&lt;/span&gt;</code></pre>
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] after:!bg-[linear-gradient(120deg,#f857a6_10%,#ef3f6e_100%)]&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-2&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-3&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-4&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-5&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-6&quot;&gt;text&lt;/span&gt;
+&lt;span class=&quot;relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] underline-gradient-7&quot;&gt;text&lt;/span&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -867,9 +867,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/tiles.html b/public/docs/elements/tiles.html
index 71d3921..5824dd9 100644
--- a/public/docs/elements/tiles.html
+++ b/public/docs/elements/tiles.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,16 +647,16 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Tiles 1</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Tiles 2</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Tiles 3</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Tiles 4</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Tiles 5</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Tiles 6</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-7">Tiles 7</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-8">Tiles 8</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-9">Tiles 9</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-10">Tiles 10</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Tiles 1</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Tiles 2</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Tiles 3</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Tiles 4</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Tiles 5</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Tiles 6</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-7">Tiles 7</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-8">Tiles 8</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-9">Tiles 9</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-10">Tiles 10</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -1277,9 +1277,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/tooltips-popovers.html b/public/docs/elements/tooltips-popovers.html
index 557a574..03defea 100644
--- a/public/docs/elements/tooltips-popovers.html
+++ b/public/docs/elements/tooltips-popovers.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,8 +647,8 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Tooltips</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Popovers</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Tooltips</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Popovers</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -702,10 +702,10 @@
             <h2 class="!mb-5 !leading-[1.35]">Popovers</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on top </a>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on right </a>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="bottom" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on bottom </a>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="left" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on left </a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on top </a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on right </a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="bottom" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on bottom </a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="left" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."> Popover on left </a>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -716,10 +716,10 @@
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
                     <pre class="language-html"><code>
-                      &#60;a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on top &#60;/a&#62;
-                      &#60;a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on right &#60;/a&#62;
-                      &#60;a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="bottom" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on bottom &#60;/a&#62;
-                      &#60;a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="left" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on left &#60;/a&#62;</code></pre>
+                      &#60;a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="top" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on top &#60;/a&#62;
+                      &#60;a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="right" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on right &#60;/a&#62;
+                      &#60;a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="bottom" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on bottom &#60;/a&#62;
+                      &#60;a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" tabindex="0" data-bs-toggle="popover" data-bs-trigger="focus" data-bs-placement="left" title="Sample Title" data-bs-content="Integer posuere ante ac dapibus posuere velit a aliquet. Cum sociis natoque."&#62; Popover on left &#60;/a&#62;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -753,9 +753,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/elements/typography.html b/public/docs/elements/typography.html
index 4d673dd..432380f 100644
--- a/public/docs/elements/typography.html
+++ b/public/docs/elements/typography.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='hover:!text-[#3f78e0] active' href='typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='hover:!text-[#e31e24] active' href='typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,14 +647,14 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Headings</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Display Headings</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Tiny Headings</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Lead</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Lists</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Blockquote</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-7">Dropcap</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-8">Links</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Headings</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Display Headings</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Tiny Headings</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Lead</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Lists</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Blockquote</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-7">Dropcap</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-8">Links</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -774,7 +774,7 @@
                   </div>
                   <!--/column -->
                   <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                    <h2 class="!text-[.75rem] uppercase  text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#343f52] !mb-0 !leading-[1.35]">Tiny Heading with Line</h2>
+                    <h2 class="!text-[.75rem] uppercase  text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#343f52] !mb-0 !leading-[1.35]">Tiny Heading with Line</h2>
                   </div>
                   <!--/column -->
                 </div>
@@ -789,7 +789,7 @@
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
                     <pre class="language-html"><code>&lt;h2 class=&quot;!text-[.75rem] uppercase !text-[#343f52]&quot;&gt;Tiny heading&lt;/h2&gt;
-&lt;h2 class=&quot;!text-[.75rem] uppercase  text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]  !text-[#343f52]&quot;&gt;Tiny heading with line&lt;/h2&gt;</code></pre>
+&lt;h2 class=&quot;!text-[.75rem] uppercase  text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]  !text-[#343f52]&quot;&gt;Tiny heading with line&lt;/h2&gt;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -833,19 +833,19 @@
                 <div class="flex flex-wrap mx-[-15px] !mt-[-30px]">
                   <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <ul class="pl-0 list-none bullet-primary  !mb-0">
-                      <li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif">Aenean eu leo quam.</li>
-                      <li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif">Nullam quis risus eget.</li>
-                      <li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif">Donec id elit non mi porta.</li>
-                      <li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif">Fusce dapibus cursus.</li>
+                      <li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif">Aenean eu leo quam.</li>
+                      <li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif">Nullam quis risus eget.</li>
+                      <li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif">Donec id elit non mi porta.</li>
+                      <li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif">Fusce dapibus cursus.</li>
                     </ul>
                   </div>
                   <!-- /column -->
                   <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <ul class="pl-0 list-none bullet-primary  !mb-0">
-<li class="relative !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"></i></span><span>Aenean eu leo quam.</span></li>
-<li class="relative !mt-[0.35rem] !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"></i></span><span>Nullam quis risus eget.</span></li>
-<li class="relative !mt-[0.35rem] !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"></i></span><span>Donec id elit non mi porta.</span></li>
-<li class="relative !mt-[0.35rem] !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"></i></span><span>Fusce dapibus cursus.</span></li>
+<li class="relative !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"></i></span><span>Aenean eu leo quam.</span></li>
+<li class="relative !mt-[0.35rem] !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"></i></span><span>Nullam quis risus eget.</span></li>
+<li class="relative !mt-[0.35rem] !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"></i></span><span>Donec id elit non mi porta.</span></li>
+<li class="relative !mt-[0.35rem] !pl-5"><span><i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"></i></span><span>Fusce dapibus cursus.</span></li>
                     </ul>
                   </div>
                   <!-- /column -->
@@ -871,17 +871,17 @@
                   <div class="code-wrapper-inner">
                     <pre class="language-html"><code>
                       &#60;ul class="pl-0 list-none bullet-primary  !mb-0"&#62;
-                        &#60;li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif"&#62;Aenean eu leo quam.&#60;/li&#62;
-                        &#60;li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif"&#62;Nullam quis risus eget.&#60;/li&#62;
-                        &#60;li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif"&#62;Donec id elit non mi porta.&#60;/li&#62;
-                        &#60;li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#3f78e0] before:left-0 before:font-SansSerif"&#62;Fusce dapibus cursus.&#60;/li&#62;
+                        &#60;li class="relative !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif"&#62;Aenean eu leo quam.&#60;/li&#62;
+                        &#60;li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif"&#62;Nullam quis risus eget.&#60;/li&#62;
+                        &#60;li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif"&#62;Donec id elit non mi porta.&#60;/li&#62;
+                        &#60;li class="relative !mt-[0.35rem] !pl-4 before:absolute before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:!text-[#e31e24] before:left-0 before:font-SansSerif"&#62;Fusce dapibus cursus.&#60;/li&#62;
                       &#60;/ul&#62;
   
                       &#60;ul class="pl-0 list-none bullet-primary  !mb-0"&#62;
-  &#60;li class="relative !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Aenean eu leo quam.&#60;/span&#62;&#60;/li&#62;
-  &#60;li class="relative !mt-[0.35rem] !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Nullam quis risus eget.&#60;/span&#62;&#60;/li&#62;
-  &#60;li class="relative !mt-[0.35rem] !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Donec id elit non mi porta.&#60;/span&#62;&#60;/li&#62;
-  &#60;li class="relative !mt-[0.35rem] !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#3f78e0] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Fusce dapibus cursus.&#60;/span&#62;&#60;/li&#62;
+  &#60;li class="relative !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Aenean eu leo quam.&#60;/span&#62;&#60;/li&#62;
+  &#60;li class="relative !mt-[0.35rem] !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Nullam quis risus eget.&#60;/span&#62;&#60;/li&#62;
+  &#60;li class="relative !mt-[0.35rem] !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Donec id elit non mi porta.&#60;/span&#62;&#60;/li&#62;
+  &#60;li class="relative !mt-[0.35rem] !pl-5"&#62;&#60;span&#62;&#60;i class="uil uil-arrow-right before:content-['\e94c'] absolute top-[-0.2rem] text-base !text-[#e31e24] left-0"&#62;&#60;/i&#62;&#60;/span&#62;&#60;span&#62;Fusce dapibus cursus.&#60;/span&#62;&#60;/li&#62;
                       &#60;/ul&#62;
   
                       &#60;ul class="pl-0 list-none bullet-bg bullet-soft-green  !mb-0"&#62;
@@ -906,7 +906,7 @@
                 <div class="flex flex-wrap mx-[-15px] !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0 items-center">
                   <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full">
                     <figure>
-                      <blockquote class="border-l-[#3f78e0] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid text-[1rem] m-[0_0_1rem]">
+                      <blockquote class="border-l-[#e31e24] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid text-[1rem] m-[0_0_1rem]">
                         <p>Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis, est non commodo luctus, nisi erat porttitor ligula lacinia odio.</p>
                       </blockquote>
                       <figcaption class="!text-[0.6rem] !text-[#aab0bc] !mb-0 before:content-['\2014\a0'] font-bold uppercase !tracking-[0.02rem]">Connor Gibson</figcaption>
@@ -941,7 +941,7 @@
                   <div class="code-wrapper-inner">
                     <pre class="language-html"><code>
                       &#60;figure&#62;
-                        &#60;blockquote class="border-l-[#3f78e0] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid text-[1rem] m-[0_0_1rem]"&#62;
+                        &#60;blockquote class="border-l-[#e31e24] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid text-[1rem] m-[0_0_1rem]"&#62;
                           &#60;p&#62;Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis, est non commodo luctus, nisi erat porttitor ligula lacinia odio.&#60;/p&#62;
                         &#60;/blockquote&#62;
                         &#60;figcaption class="!text-[0.6rem] !text-[#aab0bc] !mb-0 before:content-['\2014\a0'] font-bold uppercase !tracking-[0.02rem]"&#62;Connor Gibson&#60;/figcaption&#62;
@@ -972,11 +972,11 @@
                   </div>
                   <!-- /column -->
                   <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full">
-                    <p><span class="xl:!text-[2.5rem] block float-left !text-[calc(1.375rem_+_1.5vw)] leading-none font-medium !ml-0 !mr-[0.6rem] !mt-[0.2rem] !mb-0 !p-0 !text-[#3f78e0] ">A</span>enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.</p>
+                    <p><span class="xl:!text-[2.5rem] block float-left !text-[calc(1.375rem_+_1.5vw)] leading-none font-medium !ml-0 !mr-[0.6rem] !mt-[0.2rem] !mb-0 !p-0 !text-[#e31e24] ">A</span>enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.</p>
                   </div>
                   <!-- /column -->
                   <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full">
-                    <p><span class="xl:!text-[1.4rem] float-left leading-none font-medium m-[.25rem_.5rem_0_0] p-0 !rounded-[50%] !text-[#3f78e0]  !bg-[#e0e9fa] text-[1.4rem] h-[2.3rem] w-[2.3rem] flex content-center items-center justify-center pb-[0.15rem]">A</span>enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.</p>
+                    <p><span class="xl:!text-[1.4rem] float-left leading-none font-medium m-[.25rem_.5rem_0_0] p-0 !rounded-[50%] !text-[#e31e24]  !bg-[#e0e9fa] text-[1.4rem] h-[2.3rem] w-[2.3rem] flex content-center items-center justify-center pb-[0.15rem]">A</span>enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.</p>
                   </div>
                   <!-- /column -->
                 </div>
@@ -993,9 +993,9 @@
                     <pre class="language-html"><code>
                       &#60;p&#62;&#60;span class="xl:!text-[2.5rem] block float-left !text-[calc(1.375rem_+_1.5vw)] leading-none font-medium !ml-0 !mr-[0.6rem] !mt-[0.2rem]  !mb-0 p-0text-[#343f52]"&#62;A&#60;/span&#62;enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.&#60;/p&#62;
   
-                      &#60;p&#62;&#60;span class="xl:!text-[2.5rem] block float-left !text-[calc(1.375rem_+_1.5vw)] leading-none font-medium !ml-0 !mr-[0.6rem] !mt-[0.2rem] !mb-0 !p-0 !text-[#3f78e0] "&#62;A&#60;/span&#62;enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.&#60;/p&#62;
+                      &#60;p&#62;&#60;span class="xl:!text-[2.5rem] block float-left !text-[calc(1.375rem_+_1.5vw)] leading-none font-medium !ml-0 !mr-[0.6rem] !mt-[0.2rem] !mb-0 !p-0 !text-[#e31e24] "&#62;A&#60;/span&#62;enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.&#60;/p&#62;
   
-                      &#60;p&#62;&#60;span class="xl:!text-[1.4rem] float-left leading-none font-medium m-[.25rem_.5rem_0_0] p-0 !rounded-[50%] !text-[#3f78e0]  !bg-[#e0e9fa] text-[1.4rem] h-[2.3rem] w-[2.3rem] flex content-center items-center justify-center pb-[0.15rem]"&#62;A&#60;/span&#62;enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.&#60;/p&#62;</code></pre>
+                      &#60;p&#62;&#60;span class="xl:!text-[1.4rem] float-left leading-none font-medium m-[.25rem_.5rem_0_0] p-0 !rounded-[50%] !text-[#e31e24]  !bg-[#e0e9fa] text-[1.4rem] h-[2.3rem] w-[2.3rem] flex content-center items-center justify-center pb-[0.15rem]"&#62;A&#60;/span&#62;enean non lectus sit amet est imperdiet cursus elementum vitae eros. Cras quis odio in risus euismod suscipit. Fusce viverra ligula vel justo bibendum semper amet.&#60;/p&#62;</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -1078,9 +1078,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/faq.html b/public/docs/faq.html
index b931d70..fd5a8fd 100644
--- a/public/docs/faq.html
+++ b/public/docs/faq.html
@@ -651,18 +651,18 @@
                   aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
                   <li class="nav-item"><a
-                      class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                      class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">En</a></li>
                   <li class="nav-item"><a
-                      class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                      class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">De</a></li>
                   <li class="nav-item"><a
-                      class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                      class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -701,11 +701,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='index.html'>Get Started</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='forms.html'>Forms</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='index.html'>Get Started</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='forms.html'>Forms</a></li>
                 <li class="!mt-[0.35rem]"><a class='active' href='faq.html'>FAQ</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='changelog.html'>Changelog</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='credits.html'>Credits</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='changelog.html'>Changelog</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -715,13 +715,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/colors.html'>Colors</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/fonts.html'>Fonts</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-font.html'>Font Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/illustrations.html'>Illustrations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/colors.html'>Colors</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/fonts.html'>Fonts</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-font.html'>Font Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/illustrations.html'>Illustrations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -731,34 +731,34 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/accordion.html'>Accordion</a>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='elements/accordion.html'>Accordion</a>
                 </li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/alerts.html'>Alerts</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/animations.html'>Animations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/avatars.html'>Avatars</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/background.html'>Background</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/badges.html'>Badges</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/buttons.html'>Buttons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/card.html'>Card</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/carousel.html'>Carousel</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/dividers.html'>Dividers</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/form-elements.html'>Form Elements</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-hover.html'>Image Hover</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-mask.html'>Image Mask</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/lightbox.html'>Lightbox</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/player.html'>Media Player</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/modal.html'>Modal</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/pagination.html'>Pagination</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/progressbar.html'>Progressbar</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shadows.html'>Shadows</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shapes.html'>Shapes</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tables.html'>Tables</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tabs.html'>Tabs</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-animations.html'>Text Animations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-highlight.html'>Text Highlight</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tiles.html'>Tiles</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/typography.html'>Typography</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/alerts.html'>Alerts</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/animations.html'>Animations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/avatars.html'>Avatars</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/background.html'>Background</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/badges.html'>Badges</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/buttons.html'>Buttons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/card.html'>Card</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/carousel.html'>Carousel</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/dividers.html'>Dividers</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/form-elements.html'>Form Elements</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-hover.html'>Image Hover</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-mask.html'>Image Mask</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/lightbox.html'>Lightbox</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/player.html'>Media Player</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/modal.html'>Modal</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/pagination.html'>Pagination</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/progressbar.html'>Progressbar</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shadows.html'>Shadows</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shapes.html'>Shapes</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tables.html'>Tables</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tabs.html'>Tabs</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-animations.html'>Text Animations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-highlight.html'>Text Highlight</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tiles.html'>Tiles</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -772,7 +772,7 @@
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-5">If you don't see an answer to your question
               here, please feel free to contact us with the links below:</p>
             <a href="https://themeforest.net/user/ib-themes"
-              class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"
+              class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"
               target="_blank">Contact Form</a>
             <a href="https://truncgil.com.tr/comments"
               class="btn btn-soft-primary !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.05)]"
@@ -781,7 +781,7 @@
 
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-2">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-2" aria-expanded="true"
                     aria-controls="faq-collapse-2"> How can I remove unwanted plugins?</button>
                 </div>
@@ -803,7 +803,7 @@
 
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-3">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-3" aria-expanded="true"
                     aria-controls="faq-collapse-3"> Does Trunçgil support RTL? </button>
                 </div>
@@ -812,7 +812,7 @@
                   <div class="card-body p-[0_1.25rem_.25rem_2.35rem]">
                     <p>No, not currently. Although with the use of <a
                         href="https://rtlcss.com/learn/usage-guide/install/" target="_blank"
-                        class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom">RTLCSS</a>
+                        class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom">RTLCSS</a>
                       project you can generate RTL version of <code class="file">style.css</code>, however some template
                       specific styles won’t have support for RTL out of the box.</p>
                   </div>
@@ -823,7 +823,7 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-4">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-4" aria-expanded="true"
                     aria-controls="faq-collapse-4"> Why SVG icons appear black? </button>
                 </div>
@@ -831,7 +831,7 @@
                 <div id="faq-collapse-4" class="accordion-collapse collapse" aria-labelledby="faq-4">
                   <div class="card-body p-[0_1.25rem_.25rem_2.35rem]">
                     <p>Due to the <a href="https://en.wikipedia.org/wiki/Same-origin_policy" target="_blank"
-                        class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom">same-origin
+                        class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom">same-origin
                         policy</a> SVGInject does not work when run from the local file system in many browsers (Chrome,
                       Safari). Please test on a working web server.</p>
                   </div>
@@ -842,14 +842,14 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-5">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-5" aria-expanded="true"
                     aria-controls="faq-collapse-5"> How to make the contact or newsletter forms work? </button>
                 </div>
                 <!--/.card-header -->
                 <div id="faq-collapse-5" class="accordion-collapse collapse" aria-labelledby="faq-5">
                   <div class="card-body p-[0_1.25rem_.25rem_2.35rem]">
-                    <p>Follow the instructions <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='forms.html' target='_blank'>here</a>
+                    <p>Follow the instructions <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='forms.html' target='_blank'>here</a>
                       to reach the guide on configuring the contact or newsletter forms in Trunçgil. If the forms don't
                       work or if you receive any errors please keep in mind that the contact forms won't work on local
                       environment. Please test them on a working web server.</p>
@@ -861,7 +861,7 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-7">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-7" aria-expanded="true"
                     aria-controls="faq-collapse-7"> Does Trunçgil require jQuery? </button>
                 </div>
@@ -877,7 +877,7 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-8">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-8" aria-expanded="true"
                     aria-controls="faq-collapse-8"> Why am I getting an error while installing to Wordpress? </button>
                 </div>
@@ -893,7 +893,7 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-9">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-9" aria-expanded="true"
                     aria-controls="faq-collapse-9"> Why the image mask doesn't work on my copy of the item? </button>
                 </div>
@@ -912,7 +912,7 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-11">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-11" aria-expanded="true"
                     aria-controls="faq-collapse-11"> How to add a link to dropdown parent? </button>
                 </div>
@@ -939,7 +939,7 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-12">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-12" aria-expanded="true"
                     aria-controls="faq-collapse-12"> What font is used on the Trunçgil logo? </button>
                 </div>
@@ -957,14 +957,14 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-13">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-13" aria-expanded="true"
                     aria-controls="faq-collapse-13"> How to enable STMP authentication on my contact form? </button>
                 </div>
                 <!--/.card-header -->
                 <div id="faq-collapse-13" class="accordion-collapse collapse" aria-labelledby="faq-13">
                   <div class="card-body p-[0_1.25rem_.25rem_2.35rem]">
-                    <p>You can enable STMP authentication by following the instructions shown in <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='forms.html#snippet-1-3'>Forms
+                    <p>You can enable STMP authentication by following the instructions shown in <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='forms.html#snippet-1-3'>Forms
                         documentation</a></p>
                   </div>
                   <!--/.card-body -->
@@ -974,14 +974,14 @@
               <!--/.accordion-item -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="faq-14">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]"
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]"
                     data-bs-toggle="collapse" data-bs-target="#faq-collapse-14" aria-expanded="true"
                     aria-controls="faq-collapse-14"> How to add reCAPTCHA to my contact form? </button>
                 </div>
                 <!--/.card-header -->
                 <div id="faq-collapse-14" class="accordion-collapse collapse" aria-labelledby="faq-14">
                   <div class="card-body p-[0_1.25rem_.25rem_2.35rem]">
-                    <p>Please follow the instructions shown in <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]' href='forms.html#snippet-1-4'>Forms
+                    <p>Please follow the instructions shown in <a class='internal !pr-[1.4rem] after:content-[\'\e94c\'] after:text-[0.8rem] after:font-Unicons !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]' href='forms.html#snippet-1-4'>Forms
                         documentation</a> to add reCAPTCHA to your contact form.</p>
                   </div>
                   <!--/.card-body -->
@@ -1024,10 +1024,10 @@
   </section>
   <!-- /section -->
   <div
-    class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+    class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
       <path
-        class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none"
+        class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none"
         d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
diff --git a/public/docs/forms.html b/public/docs/forms.html
index 1ed030b..cdbacc4 100644
--- a/public/docs/forms.html
+++ b/public/docs/forms.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='index.html'>Get Started</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='index.html'>Get Started</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='credits.html'>Credits</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/typography.html'>Typography</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,15 +647,15 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] active" href="#snippet-1">Contact Form</a>
+                <li><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] active" href="#snippet-1">Contact Form</a>
                   <ul class="list-none pt-2 !pl-2 text-[0.7rem] leading-normal text-inherit">
-        <li><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-1">Recipients</a></li>
-        <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-2">Settings</a></li>
-        <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-3">SMTP</a></li>
-        <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-4">reCAPTCHA</a></li>
+        <li><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-1">Recipients</a></li>
+        <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-2">Settings</a></li>
+        <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-3">SMTP</a></li>
+        <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-4">reCAPTCHA</a></li>
                   </ul>
                 </li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Newsletter</a></li>
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Newsletter</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -764,7 +764,7 @@ $smtpPort = 587; // TCP port to connect to</code></pre>
                 <div class="card-body p-[40px]">
                   <p>You can add reCAPTCHA to your contact form in 3 easy steps:</p>
                   <ol class="!mb-0">
-                    <li>First create your <strong>reCAPTCHA v2</strong> type site key and secret key via <a href="https://www.google.com/recaptcha/admin" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !mt-[-0.25rem] hover:!text-[#3f78e0] hover:after:!text-[#3f78e0]" target="_blank">Google reCAPTCHA</a></li>
+                    <li>First create your <strong>reCAPTCHA v2</strong> type site key and secret key via <a href="https://www.google.com/recaptcha/admin" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom !mt-[-0.25rem] hover:!text-[#e31e24] hover:after:!text-[#e31e24]" target="_blank">Google reCAPTCHA</a></li>
                     <li>Then enable reCAPTCHA option in <code class="file">assets/php/contact.php</code> and enter your <strong>secret key</strong>.</li>
                     <li>Then add the reCAPTCHA field on your form's HTML code before the submit button and enter your <strong>site key</strong> inside the <code class="code">data-sitekey</code> attribute.</li>
                   </ol>
@@ -867,9 +867,9 @@ $recaptchaSecret = &apos;YOUR_SECRET_KEY&apos;; // enter your secret key from ht
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/docs/index.html b/public/docs/index.html
index 13afff3..48a8dd7 100644
--- a/public/docs/index.html
+++ b/public/docs/index.html
@@ -650,16 +650,16 @@
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown"
                   aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] "
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] "
                       href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -700,11 +700,11 @@
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
                 <li><a class='active' href='index.html'>Get Started</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='forms.html'>Forms</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='faq.html'>FAQ</a>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='forms.html'>Forms</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='faq.html'>FAQ</a>
                 </li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='changelog.html'>Changelog</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='credits.html'>Credits</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='changelog.html'>Changelog</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -714,13 +714,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/colors.html'>Colors</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/fonts.html'>Fonts</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/icons-font.html'>Font Icons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/illustrations.html'>Illustrations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='styleguide/misc.html'>Misc</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/colors.html'>Colors</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/fonts.html'>Fonts</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-svg.html'>SVG Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/icons-font.html'>Font Icons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/illustrations.html'>Illustrations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/backgrounds.html'>Backgrounds</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='styleguide/misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -730,34 +730,34 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/accordion.html'>Accordion</a>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='elements/accordion.html'>Accordion</a>
                 </li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/alerts.html'>Alerts</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/animations.html'>Animations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/avatars.html'>Avatars</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/background.html'>Background</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/badges.html'>Badges</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/buttons.html'>Buttons</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/card.html'>Card</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/carousel.html'>Carousel</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/dividers.html'>Dividers</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/form-elements.html'>Form Elements</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-hover.html'>Image Hover</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/image-mask.html'>Image Mask</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/lightbox.html'>Lightbox</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/player.html'>Media Player</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/modal.html'>Modal</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/pagination.html'>Pagination</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/progressbar.html'>Progressbar</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shadows.html'>Shadows</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/shapes.html'>Shapes</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tables.html'>Tables</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tabs.html'>Tabs</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-animations.html'>Text Animations</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/text-highlight.html'>Text Highlight</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tiles.html'>Tiles</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='elements/typography.html'>Typography</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/alerts.html'>Alerts</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/animations.html'>Animations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/avatars.html'>Avatars</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/background.html'>Background</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/badges.html'>Badges</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/buttons.html'>Buttons</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/card.html'>Card</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/carousel.html'>Carousel</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/dividers.html'>Dividers</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/form-elements.html'>Form Elements</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-hover.html'>Image Hover</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/image-mask.html'>Image Mask</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/lightbox.html'>Lightbox</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/player.html'>Media Player</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/modal.html'>Modal</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/pagination.html'>Pagination</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/progressbar.html'>Progressbar</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shadows.html'>Shadows</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/shapes.html'>Shapes</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tables.html'>Tables</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tabs.html'>Tabs</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-animations.html'>Text Animations</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/text-highlight.html'>Text Highlight</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tiles.html'>Tiles</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+                <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -771,13 +771,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] active"
+                <li><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] active"
                     href="#snippet-1">Overview</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-2">File Structure</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-3">Installation</a></li>
-                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] "
+                <li class="!mt-[0.35rem]"><a class="!text-inherit hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] "
                     href="#snippet-5">Quick Video</a></li>
               </ul>
             </nav>
@@ -796,7 +796,7 @@
                 <p>If you have any questions that are beyond the scope of this help documentation, please feel free to
                   contact us with the links below and please don't forget to provide your website URL.</p>
                 <a href="https://themeforest.net/user/ib-themes"
-                  class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"
+                  class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"
                   target="_blank">Contact Form</a>
                 <a href="https://truncgil.com.tr/comments"
                   class="btn btn-soft-primary !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.05)]"
@@ -844,7 +844,7 @@
                       class="folder !bg-[#e0e9fa]">dist/docs</code> Contain all documentation files (installation,
                     blocks, elements, etc.) regarding the template. You can also reach the documentation from the <a
                       href="index.html"
-                      class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                      class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                       target="_blank">live demo</a> as well.</li>
                   <li><code class="file !bg-[#e0e9fa]">package.json</code> Includes the list of dependencies to install
                     from npm.</li>
@@ -863,17 +863,17 @@
                   these steps:</p>
                 <ol class="!mb-0">
                   <li><strong>Install</strong> <a href="https://nodejs.org/en/"
-                      class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                      class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                       target="_blank">Node.js</a> if you don’t have it yet.</li>
                   <li><strong>Then Run</strong> <kbd class="terminal">yarn dev or npm run dev</kbd>
                   </li>
                   <li>You should now have the project files set up and all the npm packages installed.</li>
                   <li><strong>Install Vs code Live Server plugin to run HTML file locally</strong> <a
                       href="https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer"
-                      class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                      class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                       target="_blank">Live Server</a> if you don’t have it yet. You can check this video guide <a
                       href="https://youtu.be/9kEOkw_LvGU?si=UXmIWI4qW0KgAVqV"
-                      class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                      class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                       target="_blank">Video Guide</a></li>
                   <li><strong>Build</strong> <kbd class="terminal">npm run build or yarn build </kbd> you wll run this
                     command after
@@ -890,13 +890,13 @@
             <div class="card">
               <div class="card-body p-[40px]">
                 <p class="!mb-2">This <a href="https://youtu.be/5uAiBfQsB1k"
-                    class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                    class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                     target="_blank">quick video</a> demonstrates:</p>
                 <p class="!mb-2">This <a href="https://youtu.be/l4IAxGmEUBI"
-                    class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                    class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                     target="_blank">How to Change Color</a> demonstrates:</p>
                 <p class="!mb-2">This <a href="https://youtu.be/uqTmqQJMDHU"
-                    class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
+                    class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom"
                     target="_blank">How to Change icon font</a> demonstrates:</p>
                 <ul class="pl-0 list-none  !mb-0">
                   <li>Installing npm packages (Terminal command: <kbd class="terminal !mt-[-0.25rem]">npm install or
@@ -944,10 +944,10 @@
   </section>
   <!-- /section -->
   <div
-    class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+    class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
       <path
-        class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none"
+        class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none"
         d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/adjust.html b/public/docs/styleguide/_/assets/img/icons/lineal/adjust.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/adjust.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/adjust.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/agenda.html b/public/docs/styleguide/_/assets/img/icons/lineal/agenda.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/agenda.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/agenda.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/analytics.html b/public/docs/styleguide/_/assets/img/icons/lineal/analytics.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/analytics.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/analytics.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/award-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/award-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/award-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/award-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/award.html b/public/docs/styleguide/_/assets/img/icons/lineal/award.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/award.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/award.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/badge.html b/public/docs/styleguide/_/assets/img/icons/lineal/badge.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/badge.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/badge.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/balance.html b/public/docs/styleguide/_/assets/img/icons/lineal/balance.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/balance.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/balance.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/bar-chart.html b/public/docs/styleguide/_/assets/img/icons/lineal/bar-chart.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/bar-chart.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/bar-chart.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/barcode.html b/public/docs/styleguide/_/assets/img/icons/lineal/barcode.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/barcode.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/barcode.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/bell.html b/public/docs/styleguide/_/assets/img/icons/lineal/bell.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/bell.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/bell.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/box.html b/public/docs/styleguide/_/assets/img/icons/lineal/box.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/box.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/box.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/briefcase-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/briefcase-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/briefcase-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/briefcase-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/briefcase.html b/public/docs/styleguide/_/assets/img/icons/lineal/briefcase.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/briefcase.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/briefcase.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/browser-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/browser-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/browser-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/browser-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/browser.html b/public/docs/styleguide/_/assets/img/icons/lineal/browser.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/browser.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/browser.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/brush.html b/public/docs/styleguide/_/assets/img/icons/lineal/brush.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/brush.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/brush.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/bucket.html b/public/docs/styleguide/_/assets/img/icons/lineal/bucket.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/bucket.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/bucket.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/cake.html b/public/docs/styleguide/_/assets/img/icons/lineal/cake.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/cake.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/cake.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/calculator.html b/public/docs/styleguide/_/assets/img/icons/lineal/calculator.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/calculator.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/calculator.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/calendar.html b/public/docs/styleguide/_/assets/img/icons/lineal/calendar.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/calendar.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/calendar.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/certificate.html b/public/docs/styleguide/_/assets/img/icons/lineal/certificate.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/certificate.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/certificate.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/chat-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/chat-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/chat-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/chat-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/chat.html b/public/docs/styleguide/_/assets/img/icons/lineal/chat.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/chat.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/chat.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/check-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/check-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/check-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/check-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/check-list.html b/public/docs/styleguide/_/assets/img/icons/lineal/check-list.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/check-list.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/check-list.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/check.html b/public/docs/styleguide/_/assets/img/icons/lineal/check.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/check.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/check.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/clipboard.html b/public/docs/styleguide/_/assets/img/icons/lineal/clipboard.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/clipboard.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/clipboard.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/clock-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/clock-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/clock-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/clock-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/clock-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/clock-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/clock-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/clock-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/clock.html b/public/docs/styleguide/_/assets/img/icons/lineal/clock.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/clock.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/clock.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing.html b/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/cloud-computing.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/coffee-cup.html b/public/docs/styleguide/_/assets/img/icons/lineal/coffee-cup.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/coffee-cup.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/coffee-cup.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/coin.html b/public/docs/styleguide/_/assets/img/icons/lineal/coin.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/coin.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/coin.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/compass.html b/public/docs/styleguide/_/assets/img/icons/lineal/compass.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/compass.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/compass.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/computer.html b/public/docs/styleguide/_/assets/img/icons/lineal/computer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/computer.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/computer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/controller-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/controller-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/controller-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/controller-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/controller.html b/public/docs/styleguide/_/assets/img/icons/lineal/controller.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/controller.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/controller.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/crayons.html b/public/docs/styleguide/_/assets/img/icons/lineal/crayons.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/crayons.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/crayons.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/crop.html b/public/docs/styleguide/_/assets/img/icons/lineal/crop.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/crop.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/crop.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/design.html b/public/docs/styleguide/_/assets/img/icons/lineal/design.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/design.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/design.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/directions.html b/public/docs/styleguide/_/assets/img/icons/lineal/directions.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/directions.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/directions.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/discount-tag.html b/public/docs/styleguide/_/assets/img/icons/lineal/discount-tag.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/discount-tag.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/discount-tag.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/download.html b/public/docs/styleguide/_/assets/img/icons/lineal/download.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/download.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/download.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/earth.html b/public/docs/styleguide/_/assets/img/icons/lineal/earth.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/earth.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/earth.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/edit-text.html b/public/docs/styleguide/_/assets/img/icons/lineal/edit-text.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/edit-text.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/edit-text.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/email-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/email-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/email-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/email-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/email-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/email-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/email-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/email-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/email.html b/public/docs/styleguide/_/assets/img/icons/lineal/email.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/email.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/email.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/exchange.html b/public/docs/styleguide/_/assets/img/icons/lineal/exchange.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/exchange.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/exchange.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/expand.html b/public/docs/styleguide/_/assets/img/icons/lineal/expand.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/expand.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/expand.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/fax.html b/public/docs/styleguide/_/assets/img/icons/lineal/fax.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/fax.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/fax.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/files.html b/public/docs/styleguide/_/assets/img/icons/lineal/files.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/files.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/files.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/fullscreen.html b/public/docs/styleguide/_/assets/img/icons/lineal/fullscreen.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/fullscreen.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/fullscreen.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/geolocalization.html b/public/docs/styleguide/_/assets/img/icons/lineal/geolocalization.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/geolocalization.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/geolocalization.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/gift.html b/public/docs/styleguide/_/assets/img/icons/lineal/gift.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/gift.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/gift.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/group-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/group-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/group-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/group-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/growth.html b/public/docs/styleguide/_/assets/img/icons/lineal/growth.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/growth.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/growth.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/handshake.html b/public/docs/styleguide/_/assets/img/icons/lineal/handshake.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/handshake.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/handshake.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/headphone-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/headphone-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/headphone-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/headphone-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/headphone.html b/public/docs/styleguide/_/assets/img/icons/lineal/headphone.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/headphone.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/headphone.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/heart.html b/public/docs/styleguide/_/assets/img/icons/lineal/heart.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/heart.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/heart.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/home.html b/public/docs/styleguide/_/assets/img/icons/lineal/home.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/home.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/home.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/hourglass.html b/public/docs/styleguide/_/assets/img/icons/lineal/hourglass.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/hourglass.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/hourglass.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/house.html b/public/docs/styleguide/_/assets/img/icons/lineal/house.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/house.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/house.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/id-card.html b/public/docs/styleguide/_/assets/img/icons/lineal/id-card.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/id-card.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/id-card.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/insurance.html b/public/docs/styleguide/_/assets/img/icons/lineal/insurance.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/insurance.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/insurance.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/invoice.html b/public/docs/styleguide/_/assets/img/icons/lineal/invoice.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/invoice.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/invoice.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/laptop.html b/public/docs/styleguide/_/assets/img/icons/lineal/laptop.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/laptop.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/laptop.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/levels.html b/public/docs/styleguide/_/assets/img/icons/lineal/levels.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/levels.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/levels.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/light-bulb.html b/public/docs/styleguide/_/assets/img/icons/lineal/light-bulb.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/light-bulb.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/light-bulb.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/link.html b/public/docs/styleguide/_/assets/img/icons/lineal/link.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/link.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/link.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/list.html b/public/docs/styleguide/_/assets/img/icons/lineal/list.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/list.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/list.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/loading.html b/public/docs/styleguide/_/assets/img/icons/lineal/loading.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/loading.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/loading.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/lock.html b/public/docs/styleguide/_/assets/img/icons/lineal/lock.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/lock.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/lock.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/login.html b/public/docs/styleguide/_/assets/img/icons/lineal/login.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/login.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/login.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/logout.html b/public/docs/styleguide/_/assets/img/icons/lineal/logout.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/logout.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/logout.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/loss.html b/public/docs/styleguide/_/assets/img/icons/lineal/loss.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/loss.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/loss.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/loyalty.html b/public/docs/styleguide/_/assets/img/icons/lineal/loyalty.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/loyalty.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/loyalty.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/map.html b/public/docs/styleguide/_/assets/img/icons/lineal/map.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/map.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/map.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/maximize.html b/public/docs/styleguide/_/assets/img/icons/lineal/maximize.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/maximize.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/maximize.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/medal.html b/public/docs/styleguide/_/assets/img/icons/lineal/medal.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/medal.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/medal.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/meeting.html b/public/docs/styleguide/_/assets/img/icons/lineal/meeting.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/meeting.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/meeting.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/megaphone.html b/public/docs/styleguide/_/assets/img/icons/lineal/megaphone.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/megaphone.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/megaphone.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/menu.html b/public/docs/styleguide/_/assets/img/icons/lineal/menu.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/menu.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/menu.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/microphone.html b/public/docs/styleguide/_/assets/img/icons/lineal/microphone.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/microphone.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/microphone.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/minimize.html b/public/docs/styleguide/_/assets/img/icons/lineal/minimize.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/minimize.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/minimize.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/money.html b/public/docs/styleguide/_/assets/img/icons/lineal/money.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/money.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/money.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/music.html b/public/docs/styleguide/_/assets/img/icons/lineal/music.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/music.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/music.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/networking-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/networking-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/networking-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/networking-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/networking.html b/public/docs/styleguide/_/assets/img/icons/lineal/networking.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/networking.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/networking.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/open.html b/public/docs/styleguide/_/assets/img/icons/lineal/open.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/open.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/open.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/padlock.html b/public/docs/styleguide/_/assets/img/icons/lineal/padlock.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/padlock.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/padlock.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/paint-roller.html b/public/docs/styleguide/_/assets/img/icons/lineal/paint-roller.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/paint-roller.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/paint-roller.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/paper-plane.html b/public/docs/styleguide/_/assets/img/icons/lineal/paper-plane.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/paper-plane.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/paper-plane.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/paper.html b/public/docs/styleguide/_/assets/img/icons/lineal/paper.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/paper.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/paper.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/password.html b/public/docs/styleguide/_/assets/img/icons/lineal/password.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/password.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/password.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/photo-camera.html b/public/docs/styleguide/_/assets/img/icons/lineal/photo-camera.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/photo-camera.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/photo-camera.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/picture.html b/public/docs/styleguide/_/assets/img/icons/lineal/picture.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/picture.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/picture.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/pictures.html b/public/docs/styleguide/_/assets/img/icons/lineal/pictures.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/pictures.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/pictures.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart.html b/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/pie-chart.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/pin-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/pin-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/pin-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/pin-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/pin.html b/public/docs/styleguide/_/assets/img/icons/lineal/pin.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/pin.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/pin.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/plan.html b/public/docs/styleguide/_/assets/img/icons/lineal/plan.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/plan.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/plan.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/price-tag.html b/public/docs/styleguide/_/assets/img/icons/lineal/price-tag.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/price-tag.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/price-tag.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/printer.html b/public/docs/styleguide/_/assets/img/icons/lineal/printer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/printer.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/printer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/profits.html b/public/docs/styleguide/_/assets/img/icons/lineal/profits.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/profits.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/profits.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/puzzle-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/puzzle-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/puzzle-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/puzzle-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/puzzle.html b/public/docs/styleguide/_/assets/img/icons/lineal/puzzle.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/puzzle.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/puzzle.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/ranking.html b/public/docs/styleguide/_/assets/img/icons/lineal/ranking.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/ranking.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/ranking.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/refresh.html b/public/docs/styleguide/_/assets/img/icons/lineal/refresh.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/refresh.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/refresh.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/rocket.html b/public/docs/styleguide/_/assets/img/icons/lineal/rocket.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/rocket.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/rocket.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/savings.html b/public/docs/styleguide/_/assets/img/icons/lineal/savings.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/savings.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/savings.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/scale.html b/public/docs/styleguide/_/assets/img/icons/lineal/scale.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/scale.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/scale.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/scroll-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/scroll-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/scroll-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/scroll-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/scroll.html b/public/docs/styleguide/_/assets/img/icons/lineal/scroll.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/scroll.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/scroll.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/search-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/search-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/search-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/search-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/search.html b/public/docs/styleguide/_/assets/img/icons/lineal/search.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/search.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/search.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/server.html b/public/docs/styleguide/_/assets/img/icons/lineal/server.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/server.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/server.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/settings-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/settings-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/settings-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/settings-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/settings-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/settings-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/settings-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/settings-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/settings.html b/public/docs/styleguide/_/assets/img/icons/lineal/settings.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/settings.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/settings.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shield-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/shield-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shield-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shield-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shield.html b/public/docs/styleguide/_/assets/img/icons/lineal/shield.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shield.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shield.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shop-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/shop-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shop-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shop-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shop.html b/public/docs/styleguide/_/assets/img/icons/lineal/shop.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shop.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shop.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shope-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/shope-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shope-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shope-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shopping-basket.html b/public/docs/styleguide/_/assets/img/icons/lineal/shopping-basket.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shopping-basket.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shopping-basket.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/shopping-cart.html b/public/docs/styleguide/_/assets/img/icons/lineal/shopping-cart.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/shopping-cart.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/shopping-cart.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/show.html b/public/docs/styleguide/_/assets/img/icons/lineal/show.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/show.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/show.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/sitemap.html b/public/docs/styleguide/_/assets/img/icons/lineal/sitemap.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/sitemap.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/sitemap.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-4.html b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-4.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-4.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone-4.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone.html b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/smartphone.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/smartphone.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/smartwatch.html b/public/docs/styleguide/_/assets/img/icons/lineal/smartwatch.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/smartwatch.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/smartwatch.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/speedometer.html b/public/docs/styleguide/_/assets/img/icons/lineal/speedometer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/speedometer.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/speedometer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/square.html b/public/docs/styleguide/_/assets/img/icons/lineal/square.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/square.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/square.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/stars.html b/public/docs/styleguide/_/assets/img/icons/lineal/stars.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/stars.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/stars.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/startup.html b/public/docs/styleguide/_/assets/img/icons/lineal/startup.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/startup.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/startup.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/statistics.html b/public/docs/styleguide/_/assets/img/icons/lineal/statistics.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/statistics.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/statistics.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/sticker.html b/public/docs/styleguide/_/assets/img/icons/lineal/sticker.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/sticker.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/sticker.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/target-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/target-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/target-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/target-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/target.html b/public/docs/styleguide/_/assets/img/icons/lineal/target.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/target.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/target.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/team.html b/public/docs/styleguide/_/assets/img/icons/lineal/team.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/team.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/team.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/telemarketer.html b/public/docs/styleguide/_/assets/img/icons/lineal/telemarketer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/telemarketer.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/telemarketer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/telephone-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/telephone-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/telephone-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/telephone-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/telephone-3.html b/public/docs/styleguide/_/assets/img/icons/lineal/telephone-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/telephone-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/telephone-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/telephone.html b/public/docs/styleguide/_/assets/img/icons/lineal/telephone.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/telephone.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/telephone.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/television.html b/public/docs/styleguide/_/assets/img/icons/lineal/television.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/television.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/television.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/tie.html b/public/docs/styleguide/_/assets/img/icons/lineal/tie.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/tie.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/tie.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/tools.html b/public/docs/styleguide/_/assets/img/icons/lineal/tools.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/tools.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/tools.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/touch-screen.html b/public/docs/styleguide/_/assets/img/icons/lineal/touch-screen.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/touch-screen.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/touch-screen.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/truck.html b/public/docs/styleguide/_/assets/img/icons/lineal/truck.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/truck.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/truck.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/upload.html b/public/docs/styleguide/_/assets/img/icons/lineal/upload.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/upload.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/upload.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/user.html b/public/docs/styleguide/_/assets/img/icons/lineal/user.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/user.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/user.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/video-2.html b/public/docs/styleguide/_/assets/img/icons/lineal/video-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/video-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/video-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/video-camera.html b/public/docs/styleguide/_/assets/img/icons/lineal/video-camera.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/video-camera.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/video-camera.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/video-editing.html b/public/docs/styleguide/_/assets/img/icons/lineal/video-editing.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/video-editing.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/video-editing.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/video.html b/public/docs/styleguide/_/assets/img/icons/lineal/video.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/video.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/video.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/wallet.html b/public/docs/styleguide/_/assets/img/icons/lineal/wallet.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/wallet.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/wallet.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/watercolor.html b/public/docs/styleguide/_/assets/img/icons/lineal/watercolor.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/watercolor.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/watercolor.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/web.html b/public/docs/styleguide/_/assets/img/icons/lineal/web.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/web.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/web.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/lineal/workflow.html b/public/docs/styleguide/_/assets/img/icons/lineal/workflow.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/lineal/workflow.html
+++ b/public/docs/styleguide/_/assets/img/icons/lineal/workflow.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/3d.html b/public/docs/styleguide/_/assets/img/icons/solid/3d.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/3d.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/3d.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/alarm.html b/public/docs/styleguide/_/assets/img/icons/solid/alarm.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/alarm.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/alarm.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/audience.html b/public/docs/styleguide/_/assets/img/icons/solid/audience.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/audience.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/audience.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/badge.html b/public/docs/styleguide/_/assets/img/icons/solid/badge.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/badge.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/badge.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/bell.html b/public/docs/styleguide/_/assets/img/icons/solid/bell.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/bell.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/bell.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/briefcase.html b/public/docs/styleguide/_/assets/img/icons/solid/briefcase.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/briefcase.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/briefcase.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/bucket.html b/public/docs/styleguide/_/assets/img/icons/solid/bucket.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/bucket.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/bucket.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/building.html b/public/docs/styleguide/_/assets/img/icons/solid/building.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/building.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/building.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/bulb.html b/public/docs/styleguide/_/assets/img/icons/solid/bulb.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/bulb.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/bulb.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/bullhorn.html b/public/docs/styleguide/_/assets/img/icons/solid/bullhorn.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/bullhorn.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/bullhorn.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/camera.html b/public/docs/styleguide/_/assets/img/icons/solid/camera.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/camera.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/camera.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/chatting-2.html b/public/docs/styleguide/_/assets/img/icons/solid/chatting-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/chatting-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/chatting-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/chatting.html b/public/docs/styleguide/_/assets/img/icons/solid/chatting.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/chatting.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/chatting.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/checked.html b/public/docs/styleguide/_/assets/img/icons/solid/checked.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/checked.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/checked.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/cloud-download.html b/public/docs/styleguide/_/assets/img/icons/solid/cloud-download.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/cloud-download.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/cloud-download.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/cloud-group.html b/public/docs/styleguide/_/assets/img/icons/solid/cloud-group.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/cloud-group.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/cloud-group.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/cloud-network.html b/public/docs/styleguide/_/assets/img/icons/solid/cloud-network.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/cloud-network.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/cloud-network.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/cloud-transfer.html b/public/docs/styleguide/_/assets/img/icons/solid/cloud-transfer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/cloud-transfer.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/cloud-transfer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/code.html b/public/docs/styleguide/_/assets/img/icons/solid/code.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/code.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/code.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/coin-decrease.html b/public/docs/styleguide/_/assets/img/icons/solid/coin-decrease.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/coin-decrease.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/coin-decrease.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/coin-lock.html b/public/docs/styleguide/_/assets/img/icons/solid/coin-lock.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/coin-lock.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/coin-lock.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/coin-reload.html b/public/docs/styleguide/_/assets/img/icons/solid/coin-reload.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/coin-reload.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/coin-reload.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/coin.html b/public/docs/styleguide/_/assets/img/icons/solid/coin.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/coin.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/coin.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/compare.html b/public/docs/styleguide/_/assets/img/icons/solid/compare.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/compare.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/compare.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/computer.html b/public/docs/styleguide/_/assets/img/icons/solid/computer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/computer.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/computer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/content.html b/public/docs/styleguide/_/assets/img/icons/solid/content.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/content.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/content.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/crop.html b/public/docs/styleguide/_/assets/img/icons/solid/crop.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/crop.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/crop.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/crosshair.html b/public/docs/styleguide/_/assets/img/icons/solid/crosshair.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/crosshair.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/crosshair.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/currency.html b/public/docs/styleguide/_/assets/img/icons/solid/currency.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/currency.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/currency.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/deal.html b/public/docs/styleguide/_/assets/img/icons/solid/deal.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/deal.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/deal.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/delivery-box.html b/public/docs/styleguide/_/assets/img/icons/solid/delivery-box.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/delivery-box.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/delivery-box.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/devices.html b/public/docs/styleguide/_/assets/img/icons/solid/devices.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/devices.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/devices.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/discussion.html b/public/docs/styleguide/_/assets/img/icons/solid/discussion.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/discussion.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/discussion.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/dot.html b/public/docs/styleguide/_/assets/img/icons/solid/dot.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/dot.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/dot.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/edit-2.html b/public/docs/styleguide/_/assets/img/icons/solid/edit-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/edit-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/edit-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/emails.html b/public/docs/styleguide/_/assets/img/icons/solid/emails.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/emails.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/emails.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/employees.html b/public/docs/styleguide/_/assets/img/icons/solid/employees.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/employees.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/employees.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/feather.html b/public/docs/styleguide/_/assets/img/icons/solid/feather.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/feather.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/feather.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/globe-2.html b/public/docs/styleguide/_/assets/img/icons/solid/globe-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/globe-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/globe-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/health-insurance.html b/public/docs/styleguide/_/assets/img/icons/solid/health-insurance.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/health-insurance.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/health-insurance.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/images.html b/public/docs/styleguide/_/assets/img/icons/solid/images.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/images.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/images.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/infographic.html b/public/docs/styleguide/_/assets/img/icons/solid/infographic.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/infographic.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/infographic.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/lamp.html b/public/docs/styleguide/_/assets/img/icons/solid/lamp.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/lamp.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/lamp.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/layers.html b/public/docs/styleguide/_/assets/img/icons/solid/layers.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/layers.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/layers.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/layout-2.html b/public/docs/styleguide/_/assets/img/icons/solid/layout-2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/layout-2.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/layout-2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/layout-3.html b/public/docs/styleguide/_/assets/img/icons/solid/layout-3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/layout-3.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/layout-3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/like.html b/public/docs/styleguide/_/assets/img/icons/solid/like.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/like.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/like.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/link.html b/public/docs/styleguide/_/assets/img/icons/solid/link.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/link.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/link.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/list.html b/public/docs/styleguide/_/assets/img/icons/solid/list.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/list.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/list.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/lock.html b/public/docs/styleguide/_/assets/img/icons/solid/lock.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/lock.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/lock.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/marker.html b/public/docs/styleguide/_/assets/img/icons/solid/marker.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/marker.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/marker.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/medal.html b/public/docs/styleguide/_/assets/img/icons/solid/medal.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/medal.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/medal.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/monitor.html b/public/docs/styleguide/_/assets/img/icons/solid/monitor.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/monitor.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/monitor.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/navigation.html b/public/docs/styleguide/_/assets/img/icons/solid/navigation.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/navigation.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/navigation.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/network.html b/public/docs/styleguide/_/assets/img/icons/solid/network.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/network.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/network.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/paper-plane.html b/public/docs/styleguide/_/assets/img/icons/solid/paper-plane.html
index c7ec8f2..7145805 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/paper-plane.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/paper-plane.html
@@ -533,9 +533,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/partnership.html b/public/docs/styleguide/_/assets/img/icons/solid/partnership.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/partnership.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/partnership.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/pin.html b/public/docs/styleguide/_/assets/img/icons/solid/pin.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/pin.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/pin.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/price-tag.html b/public/docs/styleguide/_/assets/img/icons/solid/price-tag.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/price-tag.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/price-tag.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/printer.html b/public/docs/styleguide/_/assets/img/icons/solid/printer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/printer.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/printer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/push-cart.html b/public/docs/styleguide/_/assets/img/icons/solid/push-cart.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/push-cart.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/push-cart.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/puzzle.html b/public/docs/styleguide/_/assets/img/icons/solid/puzzle.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/puzzle.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/puzzle.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/search.html b/public/docs/styleguide/_/assets/img/icons/solid/search.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/search.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/search.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/secure.html b/public/docs/styleguide/_/assets/img/icons/solid/secure.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/secure.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/secure.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/selected.html b/public/docs/styleguide/_/assets/img/icons/solid/selected.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/selected.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/selected.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/seo.html b/public/docs/styleguide/_/assets/img/icons/solid/seo.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/seo.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/seo.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/server.html b/public/docs/styleguide/_/assets/img/icons/solid/server.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/server.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/server.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/setting.html b/public/docs/styleguide/_/assets/img/icons/solid/setting.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/setting.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/setting.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/share.html b/public/docs/styleguide/_/assets/img/icons/solid/share.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/share.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/share.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/sharing.html b/public/docs/styleguide/_/assets/img/icons/solid/sharing.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/sharing.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/sharing.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/shipment.html b/public/docs/styleguide/_/assets/img/icons/solid/shipment.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/shipment.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/shipment.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/shopping-bag.html b/public/docs/styleguide/_/assets/img/icons/solid/shopping-bag.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/shopping-bag.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/shopping-bag.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/shopping-basket.html b/public/docs/styleguide/_/assets/img/icons/solid/shopping-basket.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/shopping-basket.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/shopping-basket.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/shopping-cart.html b/public/docs/styleguide/_/assets/img/icons/solid/shopping-cart.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/shopping-cart.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/shopping-cart.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/smartphone.html b/public/docs/styleguide/_/assets/img/icons/solid/smartphone.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/smartphone.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/smartphone.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/supermarket.html b/public/docs/styleguide/_/assets/img/icons/solid/supermarket.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/supermarket.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/supermarket.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/synchronize.html b/public/docs/styleguide/_/assets/img/icons/solid/synchronize.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/synchronize.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/synchronize.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/target.html b/public/docs/styleguide/_/assets/img/icons/solid/target.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/target.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/target.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/team.html b/public/docs/styleguide/_/assets/img/icons/solid/team.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/team.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/team.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/toggle.html b/public/docs/styleguide/_/assets/img/icons/solid/toggle.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/toggle.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/toggle.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/touchscreen.html b/public/docs/styleguide/_/assets/img/icons/solid/touchscreen.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/touchscreen.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/touchscreen.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/transfer.html b/public/docs/styleguide/_/assets/img/icons/solid/transfer.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/transfer.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/transfer.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/travel-insurance.html b/public/docs/styleguide/_/assets/img/icons/solid/travel-insurance.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/travel-insurance.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/travel-insurance.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/tv-screen.html b/public/docs/styleguide/_/assets/img/icons/solid/tv-screen.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/tv-screen.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/tv-screen.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/verify.html b/public/docs/styleguide/_/assets/img/icons/solid/verify.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/verify.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/verify.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/video-chat.html b/public/docs/styleguide/_/assets/img/icons/solid/video-chat.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/video-chat.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/video-chat.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/video-player.html b/public/docs/styleguide/_/assets/img/icons/solid/video-player.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/video-player.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/video-player.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/videocall.html b/public/docs/styleguide/_/assets/img/icons/solid/videocall.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/videocall.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/videocall.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/wallet.html b/public/docs/styleguide/_/assets/img/icons/solid/wallet.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/wallet.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/wallet.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/icons/solid/web-programming.html b/public/docs/styleguide/_/assets/img/icons/solid/web-programming.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/icons/solid/web-programming.html
+++ b/public/docs/styleguide/_/assets/img/icons/solid/web-programming.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d1.html b/public/docs/styleguide/_/assets/img/illustrations/3d1.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d1.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d1.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d10.html b/public/docs/styleguide/_/assets/img/illustrations/3d10.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d10.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d10.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d11.html b/public/docs/styleguide/_/assets/img/illustrations/3d11.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d11.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d11.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d12.html b/public/docs/styleguide/_/assets/img/illustrations/3d12.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d12.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d12.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d2.html b/public/docs/styleguide/_/assets/img/illustrations/3d2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d2.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d3.html b/public/docs/styleguide/_/assets/img/illustrations/3d3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d3.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d4.html b/public/docs/styleguide/_/assets/img/illustrations/3d4.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d4.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d4.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d5.html b/public/docs/styleguide/_/assets/img/illustrations/3d5.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d5.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d5.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d6.html b/public/docs/styleguide/_/assets/img/illustrations/3d6.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d6.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d6.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d7.html b/public/docs/styleguide/_/assets/img/illustrations/3d7.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d7.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d7.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d8.html b/public/docs/styleguide/_/assets/img/illustrations/3d8.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d8.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d8.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/3d9.html b/public/docs/styleguide/_/assets/img/illustrations/3d9.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/3d9.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/3d9.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i1.html b/public/docs/styleguide/_/assets/img/illustrations/i1.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i1.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i1.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i10.html b/public/docs/styleguide/_/assets/img/illustrations/i10.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i10.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i10.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i11.html b/public/docs/styleguide/_/assets/img/illustrations/i11.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i11.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i11.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i12.html b/public/docs/styleguide/_/assets/img/illustrations/i12.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i12.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i12.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i13.html b/public/docs/styleguide/_/assets/img/illustrations/i13.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i13.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i13.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i14.html b/public/docs/styleguide/_/assets/img/illustrations/i14.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i14.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i14.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i15.html b/public/docs/styleguide/_/assets/img/illustrations/i15.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i15.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i15.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i16.html b/public/docs/styleguide/_/assets/img/illustrations/i16.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i16.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i16.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i17.html b/public/docs/styleguide/_/assets/img/illustrations/i17.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i17.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i17.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i18.html b/public/docs/styleguide/_/assets/img/illustrations/i18.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i18.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i18.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i19.html b/public/docs/styleguide/_/assets/img/illustrations/i19.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i19.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i19.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i2.html b/public/docs/styleguide/_/assets/img/illustrations/i2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i2.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i20.html b/public/docs/styleguide/_/assets/img/illustrations/i20.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i20.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i20.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i21.html b/public/docs/styleguide/_/assets/img/illustrations/i21.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i21.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i21.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i22.html b/public/docs/styleguide/_/assets/img/illustrations/i22.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i22.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i22.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i23.html b/public/docs/styleguide/_/assets/img/illustrations/i23.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i23.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i23.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i24.html b/public/docs/styleguide/_/assets/img/illustrations/i24.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i24.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i24.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i25.html b/public/docs/styleguide/_/assets/img/illustrations/i25.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i25.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i25.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i26.html b/public/docs/styleguide/_/assets/img/illustrations/i26.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i26.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i26.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i27.html b/public/docs/styleguide/_/assets/img/illustrations/i27.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i27.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i27.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i28.html b/public/docs/styleguide/_/assets/img/illustrations/i28.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i28.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i28.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i29.html b/public/docs/styleguide/_/assets/img/illustrations/i29.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i29.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i29.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i3.html b/public/docs/styleguide/_/assets/img/illustrations/i3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i3.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i30.html b/public/docs/styleguide/_/assets/img/illustrations/i30.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i30.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i30.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i31.html b/public/docs/styleguide/_/assets/img/illustrations/i31.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i31.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i31.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i32.html b/public/docs/styleguide/_/assets/img/illustrations/i32.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i32.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i32.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i4.html b/public/docs/styleguide/_/assets/img/illustrations/i4.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i4.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i4.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i5.html b/public/docs/styleguide/_/assets/img/illustrations/i5.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i5.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i5.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i6.html b/public/docs/styleguide/_/assets/img/illustrations/i6.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i6.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i6.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i7.html b/public/docs/styleguide/_/assets/img/illustrations/i7.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i7.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i7.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i8.html b/public/docs/styleguide/_/assets/img/illustrations/i8.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i8.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i8.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/i9.html b/public/docs/styleguide/_/assets/img/illustrations/i9.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/i9.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/i9.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni1.html b/public/docs/styleguide/_/assets/img/illustrations/ni1.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni1.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni1.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni2.html b/public/docs/styleguide/_/assets/img/illustrations/ni2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni2.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni3.html b/public/docs/styleguide/_/assets/img/illustrations/ni3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni3.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni4.html b/public/docs/styleguide/_/assets/img/illustrations/ni4.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni4.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni4.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni5.html b/public/docs/styleguide/_/assets/img/illustrations/ni5.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni5.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni5.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni6.html b/public/docs/styleguide/_/assets/img/illustrations/ni6.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni6.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni6.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni7.html b/public/docs/styleguide/_/assets/img/illustrations/ni7.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni7.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni7.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni8.html b/public/docs/styleguide/_/assets/img/illustrations/ni8.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni8.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni8.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ni9.html b/public/docs/styleguide/_/assets/img/illustrations/ni9.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ni9.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ni9.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ui1.html b/public/docs/styleguide/_/assets/img/illustrations/ui1.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ui1.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ui1.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ui2.html b/public/docs/styleguide/_/assets/img/illustrations/ui2.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ui2.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ui2.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ui3.html b/public/docs/styleguide/_/assets/img/illustrations/ui3.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ui3.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ui3.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ui4.html b/public/docs/styleguide/_/assets/img/illustrations/ui4.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ui4.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ui4.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/_/assets/img/illustrations/ui5.html b/public/docs/styleguide/_/assets/img/illustrations/ui5.html
index c7ec8f2..c7abfe0 100644
--- a/public/docs/styleguide/_/assets/img/illustrations/ui5.html
+++ b/public/docs/styleguide/_/assets/img/illustrations/ui5.html
@@ -533,13 +533,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/contact'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='/'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -598,7 +598,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -607,11 +607,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -629,7 +629,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -653,9 +653,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="./assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/backgrounds.html b/public/docs/styleguide/backgrounds.html
index 5cd58c2..2dd7d85 100644
--- a/public/docs/styleguide/backgrounds.html
+++ b/public/docs/styleguide/backgrounds.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='illustrations.html'>Illustrations</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='illustrations.html'>Illustrations</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='misc.html'>Misc</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,8 +647,8 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Abstract</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Gradient</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Abstract</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Gradient</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -835,9 +835,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/colors.html b/public/docs/styleguide/colors.html
index 2da11a4..65eee0a 100644
--- a/public/docs/styleguide/colors.html
+++ b/public/docs/styleguide/colors.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -593,12 +593,12 @@
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
                 <li><a href='colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='misc.html'>Misc</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] active " href="#snippet-2">Changing Primary</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Background Colors</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Text Colors</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] active " href="#snippet-2">Changing Primary</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Background Colors</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Text Colors</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -673,7 +673,7 @@
                 <div class="code-wrapper relative !mb-0">
                   <div class="code-wrapper-inner">
                     <pre class="language-scss"><code>//src/input.css OR dist/your_file.html
-                      !text-[#3f78e0]</code></pre>
+                      !text-[#e31e24]</code></pre>
                   </div>
                   <!--/.code-wrapper-inner -->
                 </div>
@@ -738,9 +738,9 @@
                   <!-- /column -->
                   <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                     <div class="card !shadow-none">
-                      <div class="card-header p-4 !border-0 !bg-[rgba(63,120,224)] opacity-100 !text-white">.bg-[#3f78e0]</div>
-                      <div class="card-body p-4 bg-[#e0e9fa] !text-[#3f78e0]">.bg-[#e0e9fa]</div>
-                      <div class="card-footer !p-4 !border-0 !bg-[#edf2fc] !text-[#3f78e0]">.bg-[#edf2fc]</div>
+                      <div class="card-header p-4 !border-0 !bg-[rgba(63,120,224)] opacity-100 !text-white">.bg-[#e31e24]</div>
+                      <div class="card-body p-4 bg-[#e0e9fa] !text-[#e31e24]">.bg-[#e0e9fa]</div>
+                      <div class="card-footer !p-4 !border-0 !bg-[#edf2fc] !text-[#e31e24]">.bg-[#edf2fc]</div>
                     </div>
                   </div>
                   <!-- /column -->
@@ -891,7 +891,7 @@
 &lt;div class=&quot;bg-[#e9eaf8]&quot;&gt;&lt;/div&gt;
 &lt;div class=&quot;bg-[#f2f3fb]&quot;&gt;&lt;/div&gt;
   
-&lt;div class=&quot;bg-[#3f78e0]&quot;&gt;&lt;/div&gt;
+&lt;div class=&quot;bg-[#e31e24]&quot;&gt;&lt;/div&gt;
 &lt;div class=&quot;bg-[#e0e9fa]&quot;&gt;&lt;/div&gt;
 &lt;div class=&quot;bg-[#edf2fc]&quot;&gt;&lt;/div&gt;
   
@@ -960,7 +960,7 @@
                   <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px]">
                     <p class="!text-[#a07cc5]">.text-[#a07cc5]</p>
                     <p class="!text-[#747ed1]">.text-[#747ed1]</p>
-                    <p class="!text-[#3f78e0]">.text-[#3f78e0]</p>
+                    <p class="!text-[#e31e24]">.text-[#e31e24]</p>
                     <p class="!text-[#54a8c7]">.text-[#54a8c7]</p>
                     <p class="!text-[#5eb9f0] !mb-0">.text-[#5eb9f0]</p>
                   </div>
@@ -974,7 +974,7 @@
                   </div>
                   <!-- /column -->
                   <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px]">
-                    <p class="!text-[#3f78e0]   !mb-0">.text-[#3f78e0] </p>
+                    <p class="!text-[#e31e24]   !mb-0">.text-[#e31e24] </p>
                   </div>
                   <!-- /column -->
                   <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px]">
@@ -1024,7 +1024,7 @@
 &lt;span class=&quot;text-[#d16b86]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#a07cc5]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#747ed1]&quot;&gt;&lt;/span&gt;
-&lt;span class=&quot;text-[#3f78e0]&quot;&gt;&lt;/span&gt;
+&lt;span class=&quot;text-[#e31e24]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#54a8c7]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#45c4a0]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#7cb798]&quot;&gt;&lt;/span&gt;
@@ -1034,7 +1034,7 @@
 &lt;span class=&quot;text-[#5eb9f0]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#e31e24]&quot;&gt;&lt;/span&gt;
 
-&lt;span class=&quot;text-[#3f78e0]&quot;&gt;&lt;/span&gt;
+&lt;span class=&quot;text-[#e31e24]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-[#aab0bc]&quot;&gt;&lt;/span&gt;
 &lt;span class=&quot;text-white&quot;&gt;&lt;/span&gt;
 
@@ -1078,9 +1078,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/fonts.html b/public/docs/styleguide/fonts.html
index 3dffaae..49578ad 100644
--- a/public/docs/styleguide/fonts.html
+++ b/public/docs/styleguide/fonts.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='colors.html'>Colors</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='colors.html'>Colors</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='misc.html'>Misc</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,9 +647,9 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Font Options</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Google Fonts</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">@font-face</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Font Options</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Google Fonts</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">@font-face</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -665,23 +665,23 @@
                 <ul class="pl-0 list-none">
                   <li class="!mb-2">
                     <h6 class="inline">Manrope</h6>
-                    <p class="inline"> <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo12.html' target='_blank'>Demo 12</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo16.html' target='_blank'>Demo 16</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo17.html' target='_blank'>Demo 17</a></p>
+                    <p class="inline"> <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo12.html' target='_blank'>Demo 12</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo16.html' target='_blank'>Demo 16</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo17.html' target='_blank'>Demo 17</a></p>
                   </li>
                   <li class="!mb-2">
                     <h6 class="inline">Thicccboi</h6>
-                    <p class="inline"> <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo3.html' target='_blank'>Demo 3</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo5.html' target='_blank'>Demo 5</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo6.html' target='_blank'>Demo 6</a></p>
+                    <p class="inline"> <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo3.html' target='_blank'>Demo 3</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo5.html' target='_blank'>Demo 5</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo6.html' target='_blank'>Demo 6</a></p>
                   </li>
                   <li class="!mb-2">
                     <h6 class="inline">DM Serif + Manrope</h6>
-                    <p class="inline  !mb-0"> <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo2.html' target='_blank'>Demo 2</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo4.html' target='_blank'>Demo 4</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo8.html' target='_blank'>Demo 8</a></p>
+                    <p class="inline  !mb-0"> <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo2.html' target='_blank'>Demo 2</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo4.html' target='_blank'>Demo 4</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo8.html' target='_blank'>Demo 8</a></p>
                   </li>
                   <li class="!mb-2">
                     <h6 class="inline">Urbanist</h6>
-                    <p class="inline  !mb-0"> <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo19.html' target='_blank'>Demo 19</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo20.html' target='_blank'>Demo 20</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo21.html' target='_blank'>Demo 21</a></p>
+                    <p class="inline  !mb-0"> <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo19.html' target='_blank'>Demo 19</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo20.html' target='_blank'>Demo 20</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo21.html' target='_blank'>Demo 21</a></p>
                   </li>
                   <li>
                     <h6 class="inline">Space Grotesk</h6>
-                    <p class="inline  !mb-0"> <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo28.html' target='_blank'>Demo 28</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo29.html' target='_blank'>Demo 29</a>, <a class='external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo30.html' target='_blank'>Demo 30</a></p>
+                    <p class="inline  !mb-0"> <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo28.html' target='_blank'>Demo 28</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo29.html' target='_blank'>Demo 29</a>, <a class='external hover:!text-[#e31e24] !pr-[1.4rem] after:content-[\'\e906\'] after:text-[0.7rem] after:font-Custom' href='../../demo30.html' target='_blank'>Demo 30</a></p>
                   </li>
                 </ul>
                 <p class="!mb-0">Manrope is the default font in Trunçgil. If you wish to use one of the other available font options to use inside the <code class="code">&lt;body&gt;</code> tag <mark class="doc">font-Your_font_name</mark> in all your HTML pages.</p>
@@ -710,7 +710,7 @@
               <div class="card-body p-[40px]">
                 <p class="!mb-0">To use a custom Google Font, 1st open <code class="file">src/input.css</code> OR <code class="file">Your_file.html</code> and add link Then 2nd Open<code class="code">tailwind.config.js</code> , and use the example below to import your google font.</p>
                 
-                <p class="!mt-2">See This Link <a href="https://tailwindcss.com/docs/font-family" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">Link</a></p>
+                <p class="!mt-2">See This Link <a href="https://tailwindcss.com/docs/font-family" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">Link</a></p>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -737,7 +737,7 @@
             <div class="card">
               <div class="card-body p-[40px]">
                 <p class="!mb-0">To use a custom font with @font-face, first add the font files inside folder <code class="folder">dist/assets/fonts/</code> Then Open<code class="code">tailwind.config.js</code> use the example below to import your custom font.</p>
-                <p class="!mt-2">See This Link <a href="https://tailwindcss.com/docs/font-family" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">Link</a></p>
+                <p class="!mt-2">See This Link <a href="https://tailwindcss.com/docs/font-family" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">Link</a></p>
               </div>
               <!--/.card-body -->
               <div class="card-footer !relative">
@@ -782,9 +782,9 @@ font-yourfontname</code></pre>
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/icons-font.html b/public/docs/styleguide/icons-font.html
index 1f8cd2b..c9e97ee 100644
--- a/public/docs/styleguide/icons-font.html
+++ b/public/docs/styleguide/icons-font.html
@@ -537,13 +537,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -579,11 +579,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -593,13 +593,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li class="!mt-[.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-svg.html'>SVG Icons</a></li>
+                <li class="!mt-[.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-svg.html'>SVG Icons</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='misc.html'>Misc</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -609,33 +609,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -648,33 +648,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#arrows">Arrows</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#brand-logos">Brand Logos</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#business">Business</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#chat">Chat</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#cloud-web">Cloud and Web</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#communication">Communication</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#construction">Construction</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#content">Content</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#design-tools">Design Tools</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#devices">Devices</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#education">Education</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#emoji">Emoji</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#file-folder">File and Folder</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#location-map">Location and Map</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#medical">Medical</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#multimedia">Multimedia</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#photo-tools">Photography Tools</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#security">Security</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#shape">Shape</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#shopping">Shopping</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#sign-symbol">Sign and Symbol</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#sports">Sports</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#time">Time</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#transport">Transport</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#user-interface">User Interface</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#users">Users</a></li>
-<li class="!mt-[.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#weather">Weather</a></li>
+<li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#arrows">Arrows</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#brand-logos">Brand Logos</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#business">Business</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#chat">Chat</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#cloud-web">Cloud and Web</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#communication">Communication</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#construction">Construction</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#content">Content</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#design-tools">Design Tools</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#devices">Devices</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#education">Education</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#emoji">Emoji</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#file-folder">File and Folder</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#location-map">Location and Map</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#medical">Medical</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#multimedia">Multimedia</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#photo-tools">Photography Tools</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#security">Security</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#shape">Shape</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#shopping">Shopping</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#sign-symbol">Sign and Symbol</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#sports">Sports</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#time">Time</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#transport">Transport</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#user-interface">User Interface</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#users">Users</a></li>
+<li class="!mt-[.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#weather">Weather</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -11678,9 +11678,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/icons-svg.html b/public/docs/styleguide/icons-svg.html
index 22470ce..feafd4f 100644
--- a/public/docs/styleguide/icons-svg.html
+++ b/public/docs/styleguide/icons-svg.html
@@ -537,13 +537,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -579,11 +579,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -593,13 +593,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='fonts.html'>Fonts</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='fonts.html'>Fonts</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='misc.html'>Misc</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -609,33 +609,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -648,32 +648,32 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Lineal</a>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Lineal</a>
                   <ul class="list-none pt-2 !pl-2 text-[0.7rem] leading-normal text-inherit">
-                    <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-1">Colors</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-2">Sizes</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-1-3">Icons</a></li>
+                    <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-1">Colors</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-2">Sizes</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-1-3">Icons</a></li>
                   </ul>
                 </li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Solid Mono</a>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Solid Mono</a>
                   <ul class="list-none pt-2 !pl-2 text-[0.7rem] leading-normal text-inherit">
-                    <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2-1">Colors</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2-2">Sizes</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2-3">Icons</a></li>
+                    <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2-1">Colors</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2-2">Sizes</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2-3">Icons</a></li>
                   </ul>
                 </li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Solid Duo</a>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Solid Duo</a>
                   <ul class="list-none pt-2 !pl-2 text-[0.7rem] leading-normal text-inherit">
-                    <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3-1">Colors</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3-2">Sizes</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3-3">Icons</a></li>
+                    <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3-1">Colors</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3-2">Sizes</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3-3">Icons</a></li>
                   </ul>
                 </li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Solid</a>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Solid</a>
                   <ul class="list-none pt-2 !pl-2 text-[0.7rem] leading-normal text-inherit">
-                    <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4-1">Colors</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4-2">Sizes</a></li>
-                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4-3">Icons</a></li>
+                    <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4-1">Colors</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4-2">Sizes</a></li>
+                    <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4-3">Icons</a></li>
                   </ul>
                 </li>
               </ul>
@@ -694,8 +694,8 @@
                   <div class="flex flex-wrap mx-[-15px] !mt-[-40px] !text-center">
                     <div class="w-6/12 md:w-4/12 lg:w-3/12 xl:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#3f78e0]  mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#3f78e0]  mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#e31e24]  mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#e31e24]  mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">text-primary </code>
                     </div>
@@ -782,8 +782,8 @@
                     <!-- /column -->
                     <div class="w-6/12 md:w-4/12 lg:w-3/12 xl:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block text-blue !text-[#3f78e0] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block text-blue !text-[#3f78e0] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block text-blue !text-[#e31e24] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block text-blue !text-[#e31e24] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">text-blue</code>
                     </div>
@@ -826,32 +826,32 @@
                   <div class="flex flex-wrap mx-[-15px] !mt-[-40px] !text-center items-end">
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg icon-svg-lg inline-block text-[#3f78e0] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg icon-svg-lg inline-block text-[#3f78e0] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg icon-svg-lg inline-block text-[#e31e24] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg icon-svg-lg inline-block text-[#e31e24] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-lg</code>
                     </div>
                     <!-- /column -->
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] inline-block text-[#3f78e0] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] inline-block text-[#3f78e0] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] inline-block text-[#e31e24] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] inline-block text-[#e31e24] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-md</code>
                     </div>
                     <!-- /column -->
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-sm</code>
                     </div>
                     <!-- /column -->
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#3f78e0] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#3f78e0] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#e31e24] mx-2"><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  text-[#e31e24] mx-2"><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-xs</code>
                     </div>
@@ -869,1496 +869,1496 @@
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/adjust.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M342.84 338.23a168.67 168.67 0 01-119.61-49.46c-65.95-66-65.95-173.27 0-239.23A169.21 169.21 0 01399.66 9.8a15.35 15.35 0 015.7 25.31L358.9 81.57a15.34 15.34 0 11-21.7-21.69l27.44-27.44a139.27 139.27 0 00-119.71 38.8c-54 54-54 141.84 0 195.83s141.84 54 195.83 0a139.31 139.31 0 0038.81-119.71l-82.73 82.72a15.34 15.34 0 01-21.69 0l-93.23-93.23a15.34 15.34 0 1121.7-21.69L386 197.53l90.9-90.89a15.35 15.35 0 0125.31 5.7 169.06 169.06 0 01-159.37 225.89z"></path><path class="lineal-fill" d="M234.08 277.92a153.29 153.29 0 01-36.08-57.1L34.65 384.12a65.93 65.93 0 000 93.23 65.93 65.93 0 0093.23 0l163.3-163.3a153.16 153.16 0 01-57.1-36.13z"></path><path class="lineal-stroke" d="M81.26 512A81.26 81.26 0 0123.8 373.28L187.1 210a15.35 15.35 0 0125.31 5.7 138.64 138.64 0 0083.91 83.92 15.34 15.34 0 015.7 25.3L138.73 488.2A80.74 80.74 0 0181.26 512zm111.65-264.44L45.5 395a50.58 50.58 0 1071.5 71.5l147.44-147.41a170 170 0 01-71.53-71.53z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/adjust.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M342.84 338.23a168.67 168.67 0 01-119.61-49.46c-65.95-66-65.95-173.27 0-239.23A169.21 169.21 0 01399.66 9.8a15.35 15.35 0 015.7 25.31L358.9 81.57a15.34 15.34 0 11-21.7-21.69l27.44-27.44a139.27 139.27 0 00-119.71 38.8c-54 54-54 141.84 0 195.83s141.84 54 195.83 0a139.31 139.31 0 0038.81-119.71l-82.73 82.72a15.34 15.34 0 01-21.69 0l-93.23-93.23a15.34 15.34 0 1121.7-21.69L386 197.53l90.9-90.89a15.35 15.35 0 0125.31 5.7 169.06 169.06 0 01-159.37 225.89z"></path><path class="lineal-fill" d="M234.08 277.92a153.29 153.29 0 01-36.08-57.1L34.65 384.12a65.93 65.93 0 000 93.23 65.93 65.93 0 0093.23 0l163.3-163.3a153.16 153.16 0 01-57.1-36.13z"></path><path class="lineal-stroke" d="M81.26 512A81.26 81.26 0 0123.8 373.28L187.1 210a15.35 15.35 0 0125.31 5.7 138.64 138.64 0 0083.91 83.92 15.34 15.34 0 015.7 25.3L138.73 488.2A80.74 80.74 0 0181.26 512zm111.65-264.44L45.5 395a50.58 50.58 0 1071.5 71.5l147.44-147.41a170 170 0 01-71.53-71.53z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">adjust</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/adjust.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/adjust.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
 
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 389.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/agenda.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M245.1 397.6H144V352c0-8.1 6.6-14.7 14.7-14.7h71.6c8.1 0 14.7 6.6 14.7 14.7v45.6h.1zM64.5 12.1C35 13.8 12 38.2 12.1 67.7v274.2c0 29.5 23 53.8 52.4 55.5V12.1z"></path><path class="lineal-stroke" d="M269.3 111.4H124.7c-6.7 0-12-5.4-12-12 0-6.7 5.4-12 12-12h144.6c6.7 0 12 5.4 12 12s-5.4 12-12 12zm-24.1 60.3h-96.4c-6.7 0-12.1-5.4-12.1-12.1s5.4-12.1 12.1-12.1h96.4c6.7 0 12 5.4 12 12.1s-5.4 12.1-12 12.1zm0 60.2h-96.4c-6.7 0-12.1-5.4-12.1-12.1s5.4-12.1 12.1-12.1h96.4c6.7 0 12 5.4 12 12.1s-5.4 12.1-12 12.1z"></path><path class="lineal-fill" d="M350 120.9h-20.5V60.7H350c15.3 0 27.7 12.4 27.7 27.7v4.8c0 15.3-12.4 27.7-27.7 27.7zm0 120.5h-20.5v-60.2H350c15.3 0 27.7 12.4 27.7 27.7v4.8c0 15.3-12.4 27.7-27.7 27.7z"></path><path class="lineal-stroke" d="M389.8 88.4c0-21.9-17.8-39.7-39.8-39.8h-8.8C338.1 21 314.8 0 286.9 0H67.7C48.6 0 30.4 8.1 17.6 22.2l-2.1 2.4-.1.1c-.6.8-1.2 1.5-1.8 2.3l-.2.3c-.6.8-1.1 1.5-1.6 2.3l-.3.5c-.5.7-.9 1.4-1.4 2.2l-.4.6L8.5 35c-.1.3-.3.5-.4.8-.3.7-.7 1.3-1 2-.2.3-.3.7-.5 1l-.9 1.8c-.2.4-.3.8-.5 1.1-.2.7-.5 1.3-.7 1.8-.1.5-.3.9-.5 1.4s-.4 1.1-.5 1.6-.4 1-.5 1.5-.3 1-.4 1.5-.3 1.1-.5 1.6-.2 1-.3 1.4-.3 1.2-.4 1.8c-.1.4-.2.9-.2 1.3-.1.7-.2 1.3-.3 2-.1.4-.1.8-.1 1.2l-.3 2.1-.1.8c-.3 2.1-.4 4-.4 6v274.2c0 2 .1 3.9.3 5.9l.1.8c.1.7.2 1.5.3 2.2.1.4.1.8.1 1.1.1.7.2 1.3.3 2 .1.4.1.9.2 1.3.1.6.3 1.2.4 1.8s.2 1 .3 1.5c.1.5.3 1.1.5 1.6s.3 1 .4 1.6.3 1 .5 1.5.4 1.1.6 1.7c.2.6.3.9.5 1.3.2.6.4 1.2.7 1.8.2.4.3.8.5 1.1.3.6.6 1.3.8 1.9.2.3.3.6.5 1 .3.7.7 1.3 1 2 .1.3.3.5.4.8l1.2 2.1c.1.2.2.4.4.6.4.7.9 1.5 1.4 2.2.1.2.2.3.3.5.5.8 1.1 1.5 1.6 2.3l.2.3c.6.8 1.2 1.6 1.8 2.3l.1.1 2.1 2.4c8.1 8.9 18.4 15.5 29.9 19l.2.1c.7.2 1.5.4 2.2.6 5.8 1.6 11.8 2.4 17.9 2.4h219.2c33.7 0 54.6-17.3 54.6-45.2v-60.2c0-6.7-5.4-12-12-12-6.7 0-12.1 5.4-12.1 12v60.2c0 14-10.3 21.1-30.5 21.1h-29.8V352c0-14.8-12-26.8-26.8-26.8h-71.6c-14.8 0-26.7 12-26.7 26.8v33.5H76.5V24.1h210.4c16.9 0 30.5 13.7 30.5 30.5v186.7c0 6.6 5.4 12 12 12H350c21.9 0 39.7-17.8 39.8-39.8v-4.8c0-10.4-4-20.3-11.3-27.7 7.2-7.4 11.3-17.4 11.3-27.7v-4.8c0-10.4-4-20.3-11.3-27.7 7.2-7.4 11.3-17.4 11.3-27.7v-4.7zM28.4 360.8v-.1c-.3-.6-.5-1.2-.8-1.8 0-.1 0-.1-.1-.2-.5-1.2-1-2.5-1.4-3.8 0-.1-.1-.2-.1-.4-.2-.5-.3-1-.4-1.6 0-.2-.1-.3-.1-.5-.1-.5-.2-1-.4-1.6l-.1-.4c-.1-.6-.2-1.3-.4-2v-.4c-.1-.5-.1-1-.2-1.6 0-.2 0-.4-.1-.6 0-.5-.1-1-.1-1.4v-.6c0-.7-.1-1.4-.1-2V67.7c0-.7 0-1.3.1-2v-.6c0-.5.1-1 .1-1.4l.1-.6c.1-.5.1-1.1.2-1.6v-.4c.1-.7.2-1.3.4-2 0-.1 0-.2.1-.4.1-.5.2-1.1.4-1.6 0-.2.1-.3.1-.5.1-.5.3-1 .5-1.6 0-.1.1-.2.1-.3.4-1.3.9-2.6 1.4-3.8l.1-.2c.2-.6.5-1.2.8-1.8v-.1c4.9-10.1 13.5-17.9 24-21.9v355.9c-10.6-4-19.2-11.9-24.1-22zm127.7-8.8c0-1.5 1.2-2.7 2.7-2.7h71.6c1.5 0 2.7 1.2 2.7 2.7v33.5h-77V352zM365.6 88.4v4.8c0 8.6-7 15.6-15.6 15.7h-8.4V72.7h8.4c8.6 0 15.6 7 15.6 15.7zm0 60.2v4.8c0 8.6-7 15.6-15.6 15.7h-8.4V133h8.4c8.6 0 15.6 7 15.6 15.6zm0 65.1c0 8.6-7 15.6-15.6 15.7h-8.4v-36.1h8.4c8.6 0 15.6 7 15.7 15.7l-.1 4.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 389.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/agenda.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M245.1 397.6H144V352c0-8.1 6.6-14.7 14.7-14.7h71.6c8.1 0 14.7 6.6 14.7 14.7v45.6h.1zM64.5 12.1C35 13.8 12 38.2 12.1 67.7v274.2c0 29.5 23 53.8 52.4 55.5V12.1z"></path><path class="lineal-stroke" d="M269.3 111.4H124.7c-6.7 0-12-5.4-12-12 0-6.7 5.4-12 12-12h144.6c6.7 0 12 5.4 12 12s-5.4 12-12 12zm-24.1 60.3h-96.4c-6.7 0-12.1-5.4-12.1-12.1s5.4-12.1 12.1-12.1h96.4c6.7 0 12 5.4 12 12.1s-5.4 12.1-12 12.1zm0 60.2h-96.4c-6.7 0-12.1-5.4-12.1-12.1s5.4-12.1 12.1-12.1h96.4c6.7 0 12 5.4 12 12.1s-5.4 12.1-12 12.1z"></path><path class="lineal-fill" d="M350 120.9h-20.5V60.7H350c15.3 0 27.7 12.4 27.7 27.7v4.8c0 15.3-12.4 27.7-27.7 27.7zm0 120.5h-20.5v-60.2H350c15.3 0 27.7 12.4 27.7 27.7v4.8c0 15.3-12.4 27.7-27.7 27.7z"></path><path class="lineal-stroke" d="M389.8 88.4c0-21.9-17.8-39.7-39.8-39.8h-8.8C338.1 21 314.8 0 286.9 0H67.7C48.6 0 30.4 8.1 17.6 22.2l-2.1 2.4-.1.1c-.6.8-1.2 1.5-1.8 2.3l-.2.3c-.6.8-1.1 1.5-1.6 2.3l-.3.5c-.5.7-.9 1.4-1.4 2.2l-.4.6L8.5 35c-.1.3-.3.5-.4.8-.3.7-.7 1.3-1 2-.2.3-.3.7-.5 1l-.9 1.8c-.2.4-.3.8-.5 1.1-.2.7-.5 1.3-.7 1.8-.1.5-.3.9-.5 1.4s-.4 1.1-.5 1.6-.4 1-.5 1.5-.3 1-.4 1.5-.3 1.1-.5 1.6-.2 1-.3 1.4-.3 1.2-.4 1.8c-.1.4-.2.9-.2 1.3-.1.7-.2 1.3-.3 2-.1.4-.1.8-.1 1.2l-.3 2.1-.1.8c-.3 2.1-.4 4-.4 6v274.2c0 2 .1 3.9.3 5.9l.1.8c.1.7.2 1.5.3 2.2.1.4.1.8.1 1.1.1.7.2 1.3.3 2 .1.4.1.9.2 1.3.1.6.3 1.2.4 1.8s.2 1 .3 1.5c.1.5.3 1.1.5 1.6s.3 1 .4 1.6.3 1 .5 1.5.4 1.1.6 1.7c.2.6.3.9.5 1.3.2.6.4 1.2.7 1.8.2.4.3.8.5 1.1.3.6.6 1.3.8 1.9.2.3.3.6.5 1 .3.7.7 1.3 1 2 .1.3.3.5.4.8l1.2 2.1c.1.2.2.4.4.6.4.7.9 1.5 1.4 2.2.1.2.2.3.3.5.5.8 1.1 1.5 1.6 2.3l.2.3c.6.8 1.2 1.6 1.8 2.3l.1.1 2.1 2.4c8.1 8.9 18.4 15.5 29.9 19l.2.1c.7.2 1.5.4 2.2.6 5.8 1.6 11.8 2.4 17.9 2.4h219.2c33.7 0 54.6-17.3 54.6-45.2v-60.2c0-6.7-5.4-12-12-12-6.7 0-12.1 5.4-12.1 12v60.2c0 14-10.3 21.1-30.5 21.1h-29.8V352c0-14.8-12-26.8-26.8-26.8h-71.6c-14.8 0-26.7 12-26.7 26.8v33.5H76.5V24.1h210.4c16.9 0 30.5 13.7 30.5 30.5v186.7c0 6.6 5.4 12 12 12H350c21.9 0 39.7-17.8 39.8-39.8v-4.8c0-10.4-4-20.3-11.3-27.7 7.2-7.4 11.3-17.4 11.3-27.7v-4.8c0-10.4-4-20.3-11.3-27.7 7.2-7.4 11.3-17.4 11.3-27.7v-4.7zM28.4 360.8v-.1c-.3-.6-.5-1.2-.8-1.8 0-.1 0-.1-.1-.2-.5-1.2-1-2.5-1.4-3.8 0-.1-.1-.2-.1-.4-.2-.5-.3-1-.4-1.6 0-.2-.1-.3-.1-.5-.1-.5-.2-1-.4-1.6l-.1-.4c-.1-.6-.2-1.3-.4-2v-.4c-.1-.5-.1-1-.2-1.6 0-.2 0-.4-.1-.6 0-.5-.1-1-.1-1.4v-.6c0-.7-.1-1.4-.1-2V67.7c0-.7 0-1.3.1-2v-.6c0-.5.1-1 .1-1.4l.1-.6c.1-.5.1-1.1.2-1.6v-.4c.1-.7.2-1.3.4-2 0-.1 0-.2.1-.4.1-.5.2-1.1.4-1.6 0-.2.1-.3.1-.5.1-.5.3-1 .5-1.6 0-.1.1-.2.1-.3.4-1.3.9-2.6 1.4-3.8l.1-.2c.2-.6.5-1.2.8-1.8v-.1c4.9-10.1 13.5-17.9 24-21.9v355.9c-10.6-4-19.2-11.9-24.1-22zm127.7-8.8c0-1.5 1.2-2.7 2.7-2.7h71.6c1.5 0 2.7 1.2 2.7 2.7v33.5h-77V352zM365.6 88.4v4.8c0 8.6-7 15.6-15.6 15.7h-8.4V72.7h8.4c8.6 0 15.6 7 15.6 15.7zm0 60.2v4.8c0 8.6-7 15.6-15.6 15.7h-8.4V133h8.4c8.6 0 15.6 7 15.6 15.6zm0 65.1c0 8.6-7 15.6-15.6 15.7h-8.4v-36.1h8.4c8.6 0 15.6 7 15.7 15.7l-.1 4.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">agenda</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/agenda.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/agenda.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/analytics.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"></path><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"></path><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/analytics.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"></path><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"></path><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">analytics</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/analytics.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/analytics.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 338.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M268.9 353h-22.6v-22.8c-1.4-42.5-36.9-75.8-79.4-74.5-40.6 1.3-73.2 33.9-74.5 74.5V353H69.7c-12.3-.3-22.5 9.5-22.7 21.8-.3 12.3 9.5 22.5 21.8 22.7h200.1c12.3.3 22.5-9.5 22.7-21.8.3-12.3-9.5-22.5-21.8-22.7h-.9z"></path><path class="lineal-stroke" d="M268.9 341h-10.6v-10.8c0-49.2-39.8-89-89-89s-89 39.8-89 89V341H69.7c-19-.3-34.6 14.8-34.9 33.7-.3 19 14.8 34.6 33.7 34.9h200.4c19-.3 34.1-15.9 33.7-34.9-.3-18.5-15.2-33.4-33.7-33.7zm0 44.5H69.7c-5.6.2-10.3-4.2-10.5-9.9-.2-5.6 4.2-10.3 9.9-10.5h116.3c6.7 0 12.1-5.4 12.1-12.1s-5.4-12.1-12.1-12.1h-81v-10.8c0-35.8 29.1-64.9 64.9-64.9 35.8 0 64.9 29.1 64.9 64.9V353c0 6.7 5.4 12.1 12.1 12.1h22.6c5.6-.2 10.3 4.2 10.5 9.9s-4.2 10.3-9.9 10.5h-.6z"></path><path class="lineal-stroke" d="M169.3 261.4C104.5 261.3 52.1 208.8 52 144V27.7C52 12.4 64.4 0 79.7 0h179.2c15.3 0 27.7 12.4 27.7 27.7v43.7c.2 6.7-5 12.2-11.7 12.4-6.7.2-12.2-5-12.4-11.7V27.7c0-2-1.6-3.6-3.6-3.6H79.7c-2 0-3.6 1.6-3.6 3.6V144c0 51.5 41.7 93.2 93.2 93.2s93.2-41.7 93.2-93.2c-.2-6.7 5.1-12.2 11.7-12.4s12.2 5.1 12.4 11.7v.7c0 64.8-52.5 117.3-117.3 117.4z"></path><path class="lineal-stroke" d="M311.4 167.5c-6.7 0-12.1-5.4-12.1-12.1 0-1.1.1-2.1.4-3.1L314 98.6c1.7-6.4-2.1-13-8.5-14.7-1-.3-2-.4-3.1-.4h-27.9c-6.7 0-12.1-5.4-12.1-12.1 0-6.7 5.4-12.1 12.1-12.1h27.9c20 0 36.1 16.2 36.1 36.1 0 3.1-.4 6.3-1.2 9.3L323 158.5c-1.4 5.3-6.2 9-11.6 9zm-284.2 0c-5.5 0-10.2-3.7-11.6-8.9L1.2 104.8c-5.1-19.3 6.3-39.1 25.6-44.2 3-.8 6.1-1.2 9.3-1.2h19.6c6.7 0 12.1 5.4 12.1 12.1 0 6.7-5.4 12.1-12.1 12.1H36.1c-6.6 0-12 5.4-12 12 0 1 .1 2.1.4 3.1l14.3 53.7c1.7 6.4-2.1 13-8.5 14.8-1 .1-2 .3-3.1.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 338.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M268.9 353h-22.6v-22.8c-1.4-42.5-36.9-75.8-79.4-74.5-40.6 1.3-73.2 33.9-74.5 74.5V353H69.7c-12.3-.3-22.5 9.5-22.7 21.8-.3 12.3 9.5 22.5 21.8 22.7h200.1c12.3.3 22.5-9.5 22.7-21.8.3-12.3-9.5-22.5-21.8-22.7h-.9z"></path><path class="lineal-stroke" d="M268.9 341h-10.6v-10.8c0-49.2-39.8-89-89-89s-89 39.8-89 89V341H69.7c-19-.3-34.6 14.8-34.9 33.7-.3 19 14.8 34.6 33.7 34.9h200.4c19-.3 34.1-15.9 33.7-34.9-.3-18.5-15.2-33.4-33.7-33.7zm0 44.5H69.7c-5.6.2-10.3-4.2-10.5-9.9-.2-5.6 4.2-10.3 9.9-10.5h116.3c6.7 0 12.1-5.4 12.1-12.1s-5.4-12.1-12.1-12.1h-81v-10.8c0-35.8 29.1-64.9 64.9-64.9 35.8 0 64.9 29.1 64.9 64.9V353c0 6.7 5.4 12.1 12.1 12.1h22.6c5.6-.2 10.3 4.2 10.5 9.9s-4.2 10.3-9.9 10.5h-.6z"></path><path class="lineal-stroke" d="M169.3 261.4C104.5 261.3 52.1 208.8 52 144V27.7C52 12.4 64.4 0 79.7 0h179.2c15.3 0 27.7 12.4 27.7 27.7v43.7c.2 6.7-5 12.2-11.7 12.4-6.7.2-12.2-5-12.4-11.7V27.7c0-2-1.6-3.6-3.6-3.6H79.7c-2 0-3.6 1.6-3.6 3.6V144c0 51.5 41.7 93.2 93.2 93.2s93.2-41.7 93.2-93.2c-.2-6.7 5.1-12.2 11.7-12.4s12.2 5.1 12.4 11.7v.7c0 64.8-52.5 117.3-117.3 117.4z"></path><path class="lineal-stroke" d="M311.4 167.5c-6.7 0-12.1-5.4-12.1-12.1 0-1.1.1-2.1.4-3.1L314 98.6c1.7-6.4-2.1-13-8.5-14.7-1-.3-2-.4-3.1-.4h-27.9c-6.7 0-12.1-5.4-12.1-12.1 0-6.7 5.4-12.1 12.1-12.1h27.9c20 0 36.1 16.2 36.1 36.1 0 3.1-.4 6.3-1.2 9.3L323 158.5c-1.4 5.3-6.2 9-11.6 9zm-284.2 0c-5.5 0-10.2-3.7-11.6-8.9L1.2 104.8c-5.1-19.3 6.3-39.1 25.6-44.2 3-.8 6.1-1.2 9.3-1.2h19.6c6.7 0 12.1 5.4 12.1 12.1 0 6.7-5.4 12.1-12.1 12.1H36.1c-6.6 0-12 5.4-12 12 0 1 .1 2.1.4 3.1l14.3 53.7c1.7 6.4-2.1 13-8.5 14.8-1 .1-2 .3-3.1.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">award</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/award.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/award.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">award-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/award-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/award-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 372.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/badge.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M344.85 245.6a11.73 11.73 0 01-9.48-18.6c3-4.12 3.51-11.49 4-19.29.47-7 1-14.17 3.24-21.18 2.19-6.75 6-12.7 9.6-18.44 4.27-6.72 8.3-13.08 8.3-18.59s-4-11.87-8.3-18.6c-3.64-5.74-7.41-11.69-9.6-18.44-2.28-7-2.77-14.21-3.24-21.18-.53-7.8-1-15.17-4-19.29s-9.95-7-17.24-9.88c-6.46-2.58-13.13-5.24-19-9.54s-10.38-9.74-14.77-15c-5.05-6.09-9.81-11.84-14.87-13.48-4.69-1.52-11.77.26-19.26 2.14-6.87 1.73-14 3.51-21.51 3.51s-14.64-1.78-21.5-3.51c-7.49-1.88-14.57-3.66-19.26-2.14-5.06 1.64-9.82 7.39-14.87 13.48-4.39 5.3-8.94 10.79-14.77 15a11.73 11.73 0 01-13.8-19c3.45-2.51 6.88-6.65 10.51-11 6.63-8 14.15-17.08 25.69-20.82 11.1-3.61 22.32-.79 32.22 1.7 5.73 1.44 11.15 2.8 15.78 2.8s10-1.36 15.78-2.8c9.9-2.49 21.12-5.31 32.23-1.7 11.53 3.74 19.05 12.82 25.68 20.82 3.63 4.38 7.06 8.52 10.52 11s8.58 4.59 13.93 6.73c9.6 3.84 20.47 8.18 27.52 17.86s7.77 21.23 8.46 31.5c.4 5.8.77 11.27 2.15 15.53 1.28 3.93 4.1 8.4 7.1 13.12 5.6 8.83 11.95 18.83 11.95 31.16s-6.35 22.32-11.95 31.15c-3 4.73-5.82 9.19-7.1 13.12-1.38 4.26-1.75 9.73-2.15 15.53-.69 10.27-1.48 21.91-8.46 31.5a11.7 11.7 0 01-9.49 4.83z"></path><path class="lineal-fill" d="M298.91 223.5c0 14.84-14.13 27.27-18.48 40.66-4.51 13.88-.54 32.2-8.94 43.75s-27.21 13.52-38.87 22-19.05 25.68-32.93 30.18c-13.38 4.35-29.54-5.08-44.37-5.08s-31 9.43-44.39 5.08C97.05 355.6 89.56 338.32 78 329.92s-30.38-10.34-38.87-22-4.42-29.92-8.93-43.76c-4.35-13.39-18.47-25.82-18.47-40.66s14.12-27.26 18.47-40.65c4.51-13.88.54-32.2 8.94-43.75s27.21-13.51 38.87-22 19-25.68 32.92-30.18c13.39-4.36 29.55 5.08 44.39 5.08s31-9.43 44.37-5.08c13.88 4.5 21.38 21.78 32.93 30.18s30.38 10.34 38.87 22 4.43 29.87 8.94 43.75c4.35 13.39 18.48 25.82 18.48 40.65z"></path><path class="lineal-stroke" d="M118.72 373a36.28 36.28 0 01-11.41-1.72c-11.53-3.74-19-12.82-25.69-20.82-3.62-4.38-7.05-8.52-10.51-11s-8.59-4.6-13.94-6.73c-9.59-3.84-20.47-8.18-27.51-17.86s-7.77-21.23-8.47-31.5c-.39-5.8-.76-11.27-2.14-15.53-1.28-3.93-4.11-8.39-7.1-13.12C6.35 245.84 0 235.83 0 223.5s6.35-22.32 12-31.15c3-4.72 5.82-9.19 7.1-13.12 1.38-4.25 1.75-9.73 2.14-15.53.7-10.27 1.49-21.91 8.47-31.5s17.92-14 27.51-17.86c5.35-2.13 10.41-4.15 13.94-6.73S78 101 81.62 96.58c6.64-8 14.16-17.08 25.69-20.82A36.28 36.28 0 01118.72 74c7.2 0 14.12 1.74 20.81 3.42 5.74 1.44 11.15 2.8 15.79 2.8s10-1.36 15.78-2.8c6.69-1.68 13.61-3.42 20.81-3.42a36.66 36.66 0 0111.41 1.71c11.53 3.79 19.05 12.86 25.68 20.87 3.63 4.38 7.06 8.52 10.52 11s8.58 4.6 13.94 6.73c9.59 3.84 20.47 8.18 27.5 17.86s7.78 21.23 8.47 31.5c.4 5.8.77 11.27 2.15 15.53 1.27 3.93 4.11 8.4 7.1 13.12 5.6 8.83 11.95 18.83 11.95 31.15s-6.34 22.34-11.95 31.16c-3 4.73-5.83 9.19-7.1 13.12-1.38 4.26-1.75 9.73-2.15 15.53-.69 10.27-1.48 21.91-8.46 31.5s-17.92 14-27.51 17.86c-5.36 2.13-10.41 4.15-13.94 6.73s-6.89 6.65-10.52 11c-6.63 8-14.15 17.08-25.68 20.83a36.66 36.66 0 01-11.41 1.8c-7.2 0-14.12-1.75-20.81-3.43-5.74-1.44-11.15-2.8-15.78-2.8s-10 1.36-15.79 2.8c-6.69 1.68-13.61 3.42-20.81 3.42zm0-275.48a13.6 13.6 0 00-4.17.57c-5.06 1.64-9.82 7.39-14.87 13.48-4.39 5.3-8.93 10.79-14.77 15s-12.58 7-19 9.55c-7.3 2.92-14.19 5.67-17.25 9.88s-3.5 11.49-4 19.29c-.47 7-1 14.17-3.24 21.18-2.19 6.75-6 12.69-9.6 18.44-4.27 6.73-8.3 13.08-8.3 18.6s4 11.87 8.3 18.59c3.64 5.75 7.41 11.69 9.6 18.44 2.28 7 2.77 14.22 3.24 21.18.53 7.8 1 15.17 4 19.3s10 7 17.25 9.87c6.46 2.58 13.13 5.25 19 9.55s10.38 9.73 14.77 15c5 6.09 9.81 11.84 14.87 13.48a13.3 13.3 0 004.17.57c4.3 0 9.54-1.31 15.09-2.71 6.87-1.72 14-3.51 21.5-3.51s14.64 1.79 21.51 3.51c5.55 1.4 10.79 2.71 15.09 2.71a13.2 13.2 0 004.16-.57c5.07-1.64 9.83-7.39 14.88-13.48 4.39-5.3 8.93-10.79 14.77-15s12.58-7 19-9.55C252.05 308 259 305.22 262 301s3.5-11.5 4-19.3c.47-7 1-14.17 3.24-21.18 2.19-6.75 6-12.69 9.6-18.44 4.27-6.72 8.3-13.08 8.3-18.59s-4-11.87-8.3-18.6c-3.64-5.75-7.41-11.69-9.6-18.44-2.28-7-2.77-14.22-3.25-21.18-.52-7.8-1-15.17-4-19.29s-9.95-7-17.24-9.88c-6.46-2.58-13.13-5.24-19-9.55s-10.38-9.73-14.77-15c-5-6.09-9.81-11.84-14.88-13.48a13.49 13.49 0 00-4.16-.57c-4.3 0-9.54 1.31-15.09 2.71-6.87 1.73-14 3.52-21.51 3.52s-14.63-1.79-21.5-3.52c-5.55-1.4-10.79-2.71-15.09-2.71z"></path><path class="lineal-stroke" d="M113.08 196.14c-4.62 0-7.73 2.15-7.73 5.35v18.87l-9.07-17.31c-3.1-6-5.2-6.91-10.36-6.91-4.62 0-7.73 2.18-7.73 5.43v48.58c0 3.2 3.18 5.43 7.73 5.43s7.73-2.23 7.73-5.43V231l11.23 20.46c2 3.66 5.43 4.13 8.2 4.13 4.55 0 7.73-2.24 7.73-5.43v-48.67c0-3.2-3.11-5.35-7.73-5.35zm46.67 13.92c3.15 0 5.35-2.9 5.35-7s-2.2-6.88-5.35-6.88h-27.23c-4 0-7 2.28-7 5.43v48.58c0 3.15 2.93 5.43 7 5.43h27.23c3.15 0 5.35-2.83 5.35-6.88s-2.2-7-5.35-7H141v-9.49h9.71c3.52 0 5.36-3.16 5.36-6.28 0-3.72-2.25-6.42-5.36-6.42H141v-9.41zm71.79-13.92c-2.87 0-4.88 1.27-5.51 3.47l-9.74 32.88-4.53-19.37c-.69-3.12-4.24-4.51-7.46-4.51s-6.76 1.39-7.45 4.49l-4.53 19.39-9.73-32.86c-.64-2.22-2.65-3.49-5.52-3.49-4 0-9.49 2.47-9.49 6.5a5.17 5.17 0 00.24 1.54L183 250.83c1 3.16 4.75 5.21 9.56 5.21 4.09 0 8.59-1.66 9.45-5.36l2.25-10.3 2.27 10.31c.84 3.69 5.35 5.35 9.44 5.35 4.8 0 8.45-2 9.56-5.2l15.22-46.65a5.29 5.29 0 00.24-1.55c0-4-5.53-6.5-9.49-6.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 372.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/badge.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M344.85 245.6a11.73 11.73 0 01-9.48-18.6c3-4.12 3.51-11.49 4-19.29.47-7 1-14.17 3.24-21.18 2.19-6.75 6-12.7 9.6-18.44 4.27-6.72 8.3-13.08 8.3-18.59s-4-11.87-8.3-18.6c-3.64-5.74-7.41-11.69-9.6-18.44-2.28-7-2.77-14.21-3.24-21.18-.53-7.8-1-15.17-4-19.29s-9.95-7-17.24-9.88c-6.46-2.58-13.13-5.24-19-9.54s-10.38-9.74-14.77-15c-5.05-6.09-9.81-11.84-14.87-13.48-4.69-1.52-11.77.26-19.26 2.14-6.87 1.73-14 3.51-21.51 3.51s-14.64-1.78-21.5-3.51c-7.49-1.88-14.57-3.66-19.26-2.14-5.06 1.64-9.82 7.39-14.87 13.48-4.39 5.3-8.94 10.79-14.77 15a11.73 11.73 0 01-13.8-19c3.45-2.51 6.88-6.65 10.51-11 6.63-8 14.15-17.08 25.69-20.82 11.1-3.61 22.32-.79 32.22 1.7 5.73 1.44 11.15 2.8 15.78 2.8s10-1.36 15.78-2.8c9.9-2.49 21.12-5.31 32.23-1.7 11.53 3.74 19.05 12.82 25.68 20.82 3.63 4.38 7.06 8.52 10.52 11s8.58 4.59 13.93 6.73c9.6 3.84 20.47 8.18 27.52 17.86s7.77 21.23 8.46 31.5c.4 5.8.77 11.27 2.15 15.53 1.28 3.93 4.1 8.4 7.1 13.12 5.6 8.83 11.95 18.83 11.95 31.16s-6.35 22.32-11.95 31.15c-3 4.73-5.82 9.19-7.1 13.12-1.38 4.26-1.75 9.73-2.15 15.53-.69 10.27-1.48 21.91-8.46 31.5a11.7 11.7 0 01-9.49 4.83z"></path><path class="lineal-fill" d="M298.91 223.5c0 14.84-14.13 27.27-18.48 40.66-4.51 13.88-.54 32.2-8.94 43.75s-27.21 13.52-38.87 22-19.05 25.68-32.93 30.18c-13.38 4.35-29.54-5.08-44.37-5.08s-31 9.43-44.39 5.08C97.05 355.6 89.56 338.32 78 329.92s-30.38-10.34-38.87-22-4.42-29.92-8.93-43.76c-4.35-13.39-18.47-25.82-18.47-40.66s14.12-27.26 18.47-40.65c4.51-13.88.54-32.2 8.94-43.75s27.21-13.51 38.87-22 19-25.68 32.92-30.18c13.39-4.36 29.55 5.08 44.39 5.08s31-9.43 44.37-5.08c13.88 4.5 21.38 21.78 32.93 30.18s30.38 10.34 38.87 22 4.43 29.87 8.94 43.75c4.35 13.39 18.48 25.82 18.48 40.65z"></path><path class="lineal-stroke" d="M118.72 373a36.28 36.28 0 01-11.41-1.72c-11.53-3.74-19-12.82-25.69-20.82-3.62-4.38-7.05-8.52-10.51-11s-8.59-4.6-13.94-6.73c-9.59-3.84-20.47-8.18-27.51-17.86s-7.77-21.23-8.47-31.5c-.39-5.8-.76-11.27-2.14-15.53-1.28-3.93-4.11-8.39-7.1-13.12C6.35 245.84 0 235.83 0 223.5s6.35-22.32 12-31.15c3-4.72 5.82-9.19 7.1-13.12 1.38-4.25 1.75-9.73 2.14-15.53.7-10.27 1.49-21.91 8.47-31.5s17.92-14 27.51-17.86c5.35-2.13 10.41-4.15 13.94-6.73S78 101 81.62 96.58c6.64-8 14.16-17.08 25.69-20.82A36.28 36.28 0 01118.72 74c7.2 0 14.12 1.74 20.81 3.42 5.74 1.44 11.15 2.8 15.79 2.8s10-1.36 15.78-2.8c6.69-1.68 13.61-3.42 20.81-3.42a36.66 36.66 0 0111.41 1.71c11.53 3.79 19.05 12.86 25.68 20.87 3.63 4.38 7.06 8.52 10.52 11s8.58 4.6 13.94 6.73c9.59 3.84 20.47 8.18 27.5 17.86s7.78 21.23 8.47 31.5c.4 5.8.77 11.27 2.15 15.53 1.27 3.93 4.11 8.4 7.1 13.12 5.6 8.83 11.95 18.83 11.95 31.15s-6.34 22.34-11.95 31.16c-3 4.73-5.83 9.19-7.1 13.12-1.38 4.26-1.75 9.73-2.15 15.53-.69 10.27-1.48 21.91-8.46 31.5s-17.92 14-27.51 17.86c-5.36 2.13-10.41 4.15-13.94 6.73s-6.89 6.65-10.52 11c-6.63 8-14.15 17.08-25.68 20.83a36.66 36.66 0 01-11.41 1.8c-7.2 0-14.12-1.75-20.81-3.43-5.74-1.44-11.15-2.8-15.78-2.8s-10 1.36-15.79 2.8c-6.69 1.68-13.61 3.42-20.81 3.42zm0-275.48a13.6 13.6 0 00-4.17.57c-5.06 1.64-9.82 7.39-14.87 13.48-4.39 5.3-8.93 10.79-14.77 15s-12.58 7-19 9.55c-7.3 2.92-14.19 5.67-17.25 9.88s-3.5 11.49-4 19.29c-.47 7-1 14.17-3.24 21.18-2.19 6.75-6 12.69-9.6 18.44-4.27 6.73-8.3 13.08-8.3 18.6s4 11.87 8.3 18.59c3.64 5.75 7.41 11.69 9.6 18.44 2.28 7 2.77 14.22 3.24 21.18.53 7.8 1 15.17 4 19.3s10 7 17.25 9.87c6.46 2.58 13.13 5.25 19 9.55s10.38 9.73 14.77 15c5 6.09 9.81 11.84 14.87 13.48a13.3 13.3 0 004.17.57c4.3 0 9.54-1.31 15.09-2.71 6.87-1.72 14-3.51 21.5-3.51s14.64 1.79 21.51 3.51c5.55 1.4 10.79 2.71 15.09 2.71a13.2 13.2 0 004.16-.57c5.07-1.64 9.83-7.39 14.88-13.48 4.39-5.3 8.93-10.79 14.77-15s12.58-7 19-9.55C252.05 308 259 305.22 262 301s3.5-11.5 4-19.3c.47-7 1-14.17 3.24-21.18 2.19-6.75 6-12.69 9.6-18.44 4.27-6.72 8.3-13.08 8.3-18.59s-4-11.87-8.3-18.6c-3.64-5.75-7.41-11.69-9.6-18.44-2.28-7-2.77-14.22-3.25-21.18-.52-7.8-1-15.17-4-19.29s-9.95-7-17.24-9.88c-6.46-2.58-13.13-5.24-19-9.55s-10.38-9.73-14.77-15c-5-6.09-9.81-11.84-14.88-13.48a13.49 13.49 0 00-4.16-.57c-4.3 0-9.54 1.31-15.09 2.71-6.87 1.73-14 3.52-21.51 3.52s-14.63-1.79-21.5-3.52c-5.55-1.4-10.79-2.71-15.09-2.71z"></path><path class="lineal-stroke" d="M113.08 196.14c-4.62 0-7.73 2.15-7.73 5.35v18.87l-9.07-17.31c-3.1-6-5.2-6.91-10.36-6.91-4.62 0-7.73 2.18-7.73 5.43v48.58c0 3.2 3.18 5.43 7.73 5.43s7.73-2.23 7.73-5.43V231l11.23 20.46c2 3.66 5.43 4.13 8.2 4.13 4.55 0 7.73-2.24 7.73-5.43v-48.67c0-3.2-3.11-5.35-7.73-5.35zm46.67 13.92c3.15 0 5.35-2.9 5.35-7s-2.2-6.88-5.35-6.88h-27.23c-4 0-7 2.28-7 5.43v48.58c0 3.15 2.93 5.43 7 5.43h27.23c3.15 0 5.35-2.83 5.35-6.88s-2.2-7-5.35-7H141v-9.49h9.71c3.52 0 5.36-3.16 5.36-6.28 0-3.72-2.25-6.42-5.36-6.42H141v-9.41zm71.79-13.92c-2.87 0-4.88 1.27-5.51 3.47l-9.74 32.88-4.53-19.37c-.69-3.12-4.24-4.51-7.46-4.51s-6.76 1.39-7.45 4.49l-4.53 19.39-9.73-32.86c-.64-2.22-2.65-3.49-5.52-3.49-4 0-9.49 2.47-9.49 6.5a5.17 5.17 0 00.24 1.54L183 250.83c1 3.16 4.75 5.21 9.56 5.21 4.09 0 8.59-1.66 9.45-5.36l2.25-10.3 2.27 10.31c.84 3.69 5.35 5.35 9.44 5.35 4.8 0 8.45-2 9.56-5.2l15.22-46.65a5.29 5.29 0 00.24-1.55c0-4-5.53-6.5-9.49-6.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">badge</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/badge.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/badge.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 499.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/balance.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M114.32 343.22H89.6A74.6 74.6 0 0115 268.61v-19.28h174v19.28a74.61 74.61 0 01-74.68 74.61zm308.08 0h-24.72a74.61 74.61 0 01-74.62-74.61v-19.28H497v19.28a74.6 74.6 0 01-74.6 74.61z"></path><path class="lineal-stroke" d="M511.51 248.23v-.51c0-.17-.08-.58-.13-.87s-.06-.39-.1-.57-.12-.48-.18-.71-.13-.48-.2-.71-.13-.36-.2-.55-.2-.55-.32-.82l-.22-.45c-.14-.29-.28-.57-.43-.85a.61.61 0 01-.07-.14l-43.49-75.32a14.55 14.55 0 10-25.2 14.55l30.88 53.5H348.27l70.17-121.55h79a14.55 14.55 0 100-29.1H310.85a57 57 0 00-40.3-40.3V14.55a14.55 14.55 0 10-29.1 0v41.94A14.55 14.55 0 00256 71a27.65 27.65 0 010 55.29 27.69 27.69 0 01-27.63-27.65 14.55 14.55 0 00-14.57-14.51H14.55a14.55 14.55 0 000 29.1h62.21L2.38 242.05l-.06.14c-.16.28-.3.56-.44.85l-.22.45c-.12.27-.22.55-.32.82s-.14.37-.2.55-.13.47-.2.71-.13.47-.18.71-.07.38-.1.57-.1.58-.13.87 0 .34 0 .51v20.37a89.27 89.27 0 0089.07 89.17h24.72a89.27 89.27 0 0089.17-89.17v-20.88c0-.17-.09-.58-.14-.87s-.06-.39-.1-.57-.12-.48-.18-.71-.12-.48-.19-.71-.14-.36-.21-.55-.2-.55-.32-.82-.14-.3-.21-.45-.28-.57-.44-.85l-.07-.14-45.29-78.44a14.55 14.55 0 00-25.2 14.55l32.69 56.62H40.19l70.17-121.55h90.79a57 57 0 0040.3 40.3v245.16H114.13a14.55 14.55 0 00-14.55 14.55v71.3a14.56 14.56 0 0014.55 14.55h283.74a14.55 14.55 0 0014.55-14.55v-71.3a14.54 14.54 0 00-14.55-14.55h-71.54a14.55 14.55 0 100 29.1h57V470H128.68v-42.2H256a14.55 14.55 0 0014.55-14.55V153.53a57 57 0 0040.3-40.3h74l-74.39 128.82a.61.61 0 01-.07.14c-.15.28-.29.56-.43.85l-.22.45c-.12.27-.22.55-.32.82s-.14.37-.2.55-.14.47-.2.71-.13.47-.18.71-.07.38-.1.57-.1.58-.13.87 0 .34 0 .51-.05.63-.05.94v19.43a89.28 89.28 0 0089.17 89.17h24.67a89.27 89.27 0 0089.17-89.17v-19.43l-.06-.94zm-337.12 20.38a60.13 60.13 0 01-60.07 60.06H89.6a60.12 60.12 0 01-60.06-60.06v-4.73h144.85v4.73zm308.07 0a60.12 60.12 0 01-60.06 60.06h-24.72a60.13 60.13 0 01-60.07-60.06v-4.73h144.85z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 499.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/balance.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M114.32 343.22H89.6A74.6 74.6 0 0115 268.61v-19.28h174v19.28a74.61 74.61 0 01-74.68 74.61zm308.08 0h-24.72a74.61 74.61 0 01-74.62-74.61v-19.28H497v19.28a74.6 74.6 0 01-74.6 74.61z"></path><path class="lineal-stroke" d="M511.51 248.23v-.51c0-.17-.08-.58-.13-.87s-.06-.39-.1-.57-.12-.48-.18-.71-.13-.48-.2-.71-.13-.36-.2-.55-.2-.55-.32-.82l-.22-.45c-.14-.29-.28-.57-.43-.85a.61.61 0 01-.07-.14l-43.49-75.32a14.55 14.55 0 10-25.2 14.55l30.88 53.5H348.27l70.17-121.55h79a14.55 14.55 0 100-29.1H310.85a57 57 0 00-40.3-40.3V14.55a14.55 14.55 0 10-29.1 0v41.94A14.55 14.55 0 00256 71a27.65 27.65 0 010 55.29 27.69 27.69 0 01-27.63-27.65 14.55 14.55 0 00-14.57-14.51H14.55a14.55 14.55 0 000 29.1h62.21L2.38 242.05l-.06.14c-.16.28-.3.56-.44.85l-.22.45c-.12.27-.22.55-.32.82s-.14.37-.2.55-.13.47-.2.71-.13.47-.18.71-.07.38-.1.57-.1.58-.13.87 0 .34 0 .51v20.37a89.27 89.27 0 0089.07 89.17h24.72a89.27 89.27 0 0089.17-89.17v-20.88c0-.17-.09-.58-.14-.87s-.06-.39-.1-.57-.12-.48-.18-.71-.12-.48-.19-.71-.14-.36-.21-.55-.2-.55-.32-.82-.14-.3-.21-.45-.28-.57-.44-.85l-.07-.14-45.29-78.44a14.55 14.55 0 00-25.2 14.55l32.69 56.62H40.19l70.17-121.55h90.79a57 57 0 0040.3 40.3v245.16H114.13a14.55 14.55 0 00-14.55 14.55v71.3a14.56 14.56 0 0014.55 14.55h283.74a14.55 14.55 0 0014.55-14.55v-71.3a14.54 14.54 0 00-14.55-14.55h-71.54a14.55 14.55 0 100 29.1h57V470H128.68v-42.2H256a14.55 14.55 0 0014.55-14.55V153.53a57 57 0 0040.3-40.3h74l-74.39 128.82a.61.61 0 01-.07.14c-.15.28-.29.56-.43.85l-.22.45c-.12.27-.22.55-.32.82s-.14.37-.2.55-.14.47-.2.71-.13.47-.18.71-.07.38-.1.57-.1.58-.13.87 0 .34 0 .51-.05.63-.05.94v19.43a89.28 89.28 0 0089.17 89.17h24.67a89.27 89.27 0 0089.17-89.17v-19.43l-.06-.94zm-337.12 20.38a60.13 60.13 0 01-60.07 60.06H89.6a60.12 60.12 0 01-60.06-60.06v-4.73h144.85v4.73zm308.07 0a60.12 60.12 0 01-60.06 60.06h-24.72a60.13 60.13 0 01-60.07-60.06v-4.73h144.85z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">balance</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/balance.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/balance.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 431.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bar-chart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M125.8 121.3h86.6v296.4h-86.6zM299 13.5h86.6v404.2H299z"></path><path class="lineal-stroke" d="M498.5 404.2h-11.8V161.7c0-7.5-6-13.5-13.5-13.5s-13.5 6-13.5 13.5v242.5h-59.6V94.3h73.1c7.4 0 13.5-6 13.5-13.5s-6-13.5-13.5-13.5h-74.1V13.5c0-7.4-6-13.5-13.5-13.5H299c-7.4 0-13.5 6-13.5 13.5v134.8h-59.7v-27c0-7.4-6-13.5-13.5-13.5h-73.6V33.7c0-7.4-6-13.5-13.5-13.5H38.7c-7.4 0-13.5 6-13.5 13.5v294.4c0 7.5 6 13.5 13.5 13.5s13.5-6 13.5-13.5V47.2h59.7v357.1H13.5c-7.4.2-13.3 6.4-13.1 13.8.2 7.2 6 12.9 13.1 13.1h485.1c7.4-.2 13.3-6.4 13.1-13.8-.3-7.2-6-13-13.2-13.2zM139.3 134.7H199v269.5h-59.7V134.7zm86.6 40.5h59.7v229h-59.7v-229zm86.6 229V27h59.7v377.2h-59.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 431.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bar-chart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M125.8 121.3h86.6v296.4h-86.6zM299 13.5h86.6v404.2H299z"></path><path class="lineal-stroke" d="M498.5 404.2h-11.8V161.7c0-7.5-6-13.5-13.5-13.5s-13.5 6-13.5 13.5v242.5h-59.6V94.3h73.1c7.4 0 13.5-6 13.5-13.5s-6-13.5-13.5-13.5h-74.1V13.5c0-7.4-6-13.5-13.5-13.5H299c-7.4 0-13.5 6-13.5 13.5v134.8h-59.7v-27c0-7.4-6-13.5-13.5-13.5h-73.6V33.7c0-7.4-6-13.5-13.5-13.5H38.7c-7.4 0-13.5 6-13.5 13.5v294.4c0 7.5 6 13.5 13.5 13.5s13.5-6 13.5-13.5V47.2h59.7v357.1H13.5c-7.4.2-13.3 6.4-13.1 13.8.2 7.2 6 12.9 13.1 13.1h485.1c7.4-.2 13.3-6.4 13.1-13.8-.3-7.2-6-13-13.2-13.2zM139.3 134.7H199v269.5h-59.7V134.7zm86.6 40.5h59.7v229h-59.7v-229zm86.6 229V27h59.7v377.2h-59.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bar-chart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/bar-chart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/bar-chart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 360.59" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/barcode.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M11.58 313.75A11.57 11.57 0 010 302.17V11.58a11.58 11.58 0 0123.16 0v290.59a11.58 11.58 0 01-11.58 11.58zM55 254.7a11.58 11.58 0 01-11.58-11.58V11.58a11.58 11.58 0 1123.16 0v231.54A11.57 11.57 0 0155 254.7zm43.33 0a11.57 11.57 0 01-11.58-11.58V104.18a11.58 11.58 0 1123.16 0v138.94a11.59 11.59 0 01-11.58 11.58zm0-185.95a11.57 11.57 0 01-11.58-11.57v-45.6a11.58 11.58 0 0123.16 0v45.6a11.58 11.58 0 01-11.58 11.57zm86.75 41.7a11.57 11.57 0 01-11.58-11.57v-87.3a11.58 11.58 0 1123.16 0v87.3a11.58 11.58 0 01-11.58 11.57zM141.7 254.7a11.58 11.58 0 01-11.58-11.58V11.58a11.58 11.58 0 0123.16 0v231.54a11.57 11.57 0 01-11.58 11.58z"></path><path class="lineal-fill" d="M350.3 244a82.85 82.85 0 11-82.85-82.85A82.85 82.85 0 01350.3 244z"></path><path class="lineal-stroke" d="M380.61 340.82l-38.72-38.71a93.64 93.64 0 0020-58.07 94.92 94.92 0 00-3.06-23.93c0-.43.07-.86.07-1.3V11.58a11.58 11.58 0 10-23.15 0v167.29c-.51-.53-1-1.07-1.52-1.59a94.21 94.21 0 00-31.28-20.78V11.58a11.58 11.58 0 10-23.16 0v138.86a94.62 94.62 0 00-39.79 3.21V11.58a11.58 11.58 0 00-23.16 0v152.73a94.62 94.62 0 00-16.18 13c-1.41 1.4-2.74 2.85-4 4.32v-30.96a11.58 11.58 0 10-23.15 0v83.9q-.47 4.69-.47 9.48a94.41 94.41 0 00152.49 74.44l38.71 38.71a11.58 11.58 0 0016.38-16.38zm-163.55-46.38a71.35 71.35 0 0116.67-113.21l.39-.21a71.71 71.71 0 0153.63-5.32c.19.07.39.12.6.18a71.28 71.28 0 11-71.29 118.56z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 360.59" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/barcode.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M11.58 313.75A11.57 11.57 0 010 302.17V11.58a11.58 11.58 0 0123.16 0v290.59a11.58 11.58 0 01-11.58 11.58zM55 254.7a11.58 11.58 0 01-11.58-11.58V11.58a11.58 11.58 0 1123.16 0v231.54A11.57 11.57 0 0155 254.7zm43.33 0a11.57 11.57 0 01-11.58-11.58V104.18a11.58 11.58 0 1123.16 0v138.94a11.59 11.59 0 01-11.58 11.58zm0-185.95a11.57 11.57 0 01-11.58-11.57v-45.6a11.58 11.58 0 0123.16 0v45.6a11.58 11.58 0 01-11.58 11.57zm86.75 41.7a11.57 11.57 0 01-11.58-11.57v-87.3a11.58 11.58 0 1123.16 0v87.3a11.58 11.58 0 01-11.58 11.57zM141.7 254.7a11.58 11.58 0 01-11.58-11.58V11.58a11.58 11.58 0 0123.16 0v231.54a11.57 11.57 0 01-11.58 11.58z"></path><path class="lineal-fill" d="M350.3 244a82.85 82.85 0 11-82.85-82.85A82.85 82.85 0 01350.3 244z"></path><path class="lineal-stroke" d="M380.61 340.82l-38.72-38.71a93.64 93.64 0 0020-58.07 94.92 94.92 0 00-3.06-23.93c0-.43.07-.86.07-1.3V11.58a11.58 11.58 0 10-23.15 0v167.29c-.51-.53-1-1.07-1.52-1.59a94.21 94.21 0 00-31.28-20.78V11.58a11.58 11.58 0 10-23.16 0v138.86a94.62 94.62 0 00-39.79 3.21V11.58a11.58 11.58 0 00-23.16 0v152.73a94.62 94.62 0 00-16.18 13c-1.41 1.4-2.74 2.85-4 4.32v-30.96a11.58 11.58 0 10-23.15 0v83.9q-.47 4.69-.47 9.48a94.41 94.41 0 00152.49 74.44l38.71 38.71a11.58 11.58 0 0016.38-16.38zm-163.55-46.38a71.35 71.35 0 0116.67-113.21l.39-.21a71.71 71.71 0 0153.63-5.32c.19.07.39.12.6.18a71.28 71.28 0 11-71.29 118.56z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">barcode</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/barcode.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/barcode.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 316.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bell.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M207.2 347.4h-97.6c-1.6 0-2 2-2 2.9 1.6 28.1 25.6 49.5 53.7 47.9 13.7-.8 26.4-7 35.4-17.4l.1-.2c.5-.5.9-1.1 1.4-1.6l.2-.3c.4-.5.8-1 1.2-1.6 0-.1.1-.1.1-.2.9-1.2 1.7-2.5 2.5-3.8l.1-.1c.4-.6.8-1.3 1.1-2 .7-1.4 1.4-2.8 2-4.3v-.1c.9-2.2 1.7-4.5 2.2-6.8l.3-1.2c.1-.4.2-.8.2-1.1.1-.2.1-.4.1-.6.2-1.1.4-2.2.5-3.3.1-.9.2-1.9.3-2.9v-1c0-1-.2-2.4-2-2.4l.2.1zM158.4 71.7c11.5 0 22.9 1.7 33.9 5V45.3c-.3-18.7-15.8-33.7-34.5-33.4-18.3.3-33 15.1-33.4 33.4v31.4c11.1-3.3 22.5-5 34-5z"></path><path class="lineal-stroke" d="M294.2 294.5v-91.2c0-62.2-37.8-115.1-90.5-134.8V45.3c0-24.9-20.2-45.2-45.2-45.2-25-.1-45.3 20.2-45.3 45.2v23.2c-52.7 19.7-90.6 72.7-90.6 134.8v91.2C9.8 296.6 0 307.7 0 321.1v9C0 344.9 12.1 357 26.9 357h70c4.6 30 30.5 52.6 61.5 52.6 18 0 35.1-7.8 47.1-21.3l.2-.2c.5-.6 1.1-1.3 1.6-1.9.2-.2.3-.3.4-.5.5-.6.9-1.3 1.4-1.9l.2-.3c1-1.5 2-3 2.9-4.5l.1-.2c.5-.8.9-1.5 1.3-2.3l.1-.2c.9-1.7 1.7-3.4 2.4-5.1l.1-.3c1.1-2.7 2-5.4 2.7-8.2l.3-1.2.1-.6c0-.3.1-.7.2-1.1 0-.3 0-.5.1-.8.1-.6.2-1.3.3-2h6.4v-22.6H26.9c-2.4 0-4.3-1.9-4.3-4.3v-9c0-2.4 1.9-4.3 4.3-4.3h263c2.4 0 4.3 1.9 4.3 4.3v9c0 2.4-1.9 4.3-4.3 4.3h-29.6V357h29.6c14.9 0 26.9-12.1 26.9-26.9v-9c0-13.3-9.8-24.5-22.6-26.6zm-97.9 64.3c-.4 1.2-.8 2.4-1.3 3.6l-.1.3c-.4 1-.9 2-1.4 3l-.2.4c-.2.4-.5.9-.7 1.3l-.1.2c-.6.9-1.2 1.8-1.9 2.8l-.1.2c-.3.3-.6.7-.9 1.1l-.3.3c-.4.4-.7.8-1.1 1.3l-.1.2c-4.9 5.6-11.3 9.7-18.4 11.8-20.9 6.3-43-5.7-49.2-26.6l75.8.1zM135.7 45.3c.3-12.2 10.1-21.9 22.2-22.2 12.5-.2 22.8 9.7 23.1 22.2v17c-4.6-.8-9.3-1.4-14-1.7h-.1c-.8-.1-1.6-.1-2.5-.1h-1.2c-.6 0-1.2 0-1.7-.1h-6.2c-.7 0-1.3 0-2 .1h-.8c-5.7.3-11.3.9-16.8 1.9V45.3zm135.9 248.9H45.3v-90.9c0-55.6 35.7-102.5 84-116.2.5-.1.9-.3 1.4-.4.6-.2 1.2-.3 1.7-.5.6-.1 1.2-.3 1.8-.4l1.5-.3c1-.2 2-.4 3.1-.6.4-.1.9-.2 1.3-.2.7-.1 1.5-.3 2.2-.4.4-.1.9-.1 1.3-.2l2.7-.3c.2 0 .5-.1.7-.1l3.3-.3c.4 0 .8-.1 1.2-.1.8-.1 1.6-.1 2.4-.1h1.2c1.1 0 2.2-.1 3.3-.1h.2c1.2 0 2.4 0 3.6.1h.7c1.1 0 2.1.1 3.2.2h.4c7.7.6 15.3 2 22.8 4.2l1.4.4c46.8 14.7 81.1 60.9 81.1 115.4v90.8z"></path><path class="lineal-stroke" d="M63 197.8h22.6c0-39.1 29.8-70.9 66.4-70.9v-22.6c-49.1 0-89 41.9-89 93.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 316.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bell.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M207.2 347.4h-97.6c-1.6 0-2 2-2 2.9 1.6 28.1 25.6 49.5 53.7 47.9 13.7-.8 26.4-7 35.4-17.4l.1-.2c.5-.5.9-1.1 1.4-1.6l.2-.3c.4-.5.8-1 1.2-1.6 0-.1.1-.1.1-.2.9-1.2 1.7-2.5 2.5-3.8l.1-.1c.4-.6.8-1.3 1.1-2 .7-1.4 1.4-2.8 2-4.3v-.1c.9-2.2 1.7-4.5 2.2-6.8l.3-1.2c.1-.4.2-.8.2-1.1.1-.2.1-.4.1-.6.2-1.1.4-2.2.5-3.3.1-.9.2-1.9.3-2.9v-1c0-1-.2-2.4-2-2.4l.2.1zM158.4 71.7c11.5 0 22.9 1.7 33.9 5V45.3c-.3-18.7-15.8-33.7-34.5-33.4-18.3.3-33 15.1-33.4 33.4v31.4c11.1-3.3 22.5-5 34-5z"></path><path class="lineal-stroke" d="M294.2 294.5v-91.2c0-62.2-37.8-115.1-90.5-134.8V45.3c0-24.9-20.2-45.2-45.2-45.2-25-.1-45.3 20.2-45.3 45.2v23.2c-52.7 19.7-90.6 72.7-90.6 134.8v91.2C9.8 296.6 0 307.7 0 321.1v9C0 344.9 12.1 357 26.9 357h70c4.6 30 30.5 52.6 61.5 52.6 18 0 35.1-7.8 47.1-21.3l.2-.2c.5-.6 1.1-1.3 1.6-1.9.2-.2.3-.3.4-.5.5-.6.9-1.3 1.4-1.9l.2-.3c1-1.5 2-3 2.9-4.5l.1-.2c.5-.8.9-1.5 1.3-2.3l.1-.2c.9-1.7 1.7-3.4 2.4-5.1l.1-.3c1.1-2.7 2-5.4 2.7-8.2l.3-1.2.1-.6c0-.3.1-.7.2-1.1 0-.3 0-.5.1-.8.1-.6.2-1.3.3-2h6.4v-22.6H26.9c-2.4 0-4.3-1.9-4.3-4.3v-9c0-2.4 1.9-4.3 4.3-4.3h263c2.4 0 4.3 1.9 4.3 4.3v9c0 2.4-1.9 4.3-4.3 4.3h-29.6V357h29.6c14.9 0 26.9-12.1 26.9-26.9v-9c0-13.3-9.8-24.5-22.6-26.6zm-97.9 64.3c-.4 1.2-.8 2.4-1.3 3.6l-.1.3c-.4 1-.9 2-1.4 3l-.2.4c-.2.4-.5.9-.7 1.3l-.1.2c-.6.9-1.2 1.8-1.9 2.8l-.1.2c-.3.3-.6.7-.9 1.1l-.3.3c-.4.4-.7.8-1.1 1.3l-.1.2c-4.9 5.6-11.3 9.7-18.4 11.8-20.9 6.3-43-5.7-49.2-26.6l75.8.1zM135.7 45.3c.3-12.2 10.1-21.9 22.2-22.2 12.5-.2 22.8 9.7 23.1 22.2v17c-4.6-.8-9.3-1.4-14-1.7h-.1c-.8-.1-1.6-.1-2.5-.1h-1.2c-.6 0-1.2 0-1.7-.1h-6.2c-.7 0-1.3 0-2 .1h-.8c-5.7.3-11.3.9-16.8 1.9V45.3zm135.9 248.9H45.3v-90.9c0-55.6 35.7-102.5 84-116.2.5-.1.9-.3 1.4-.4.6-.2 1.2-.3 1.7-.5.6-.1 1.2-.3 1.8-.4l1.5-.3c1-.2 2-.4 3.1-.6.4-.1.9-.2 1.3-.2.7-.1 1.5-.3 2.2-.4.4-.1.9-.1 1.3-.2l2.7-.3c.2 0 .5-.1.7-.1l3.3-.3c.4 0 .8-.1 1.2-.1.8-.1 1.6-.1 2.4-.1h1.2c1.1 0 2.2-.1 3.3-.1h.2c1.2 0 2.4 0 3.6.1h.7c1.1 0 2.1.1 3.2.2h.4c7.7.6 15.3 2 22.8 4.2l1.4.4c46.8 14.7 81.1 60.9 81.1 115.4v90.8z"></path><path class="lineal-stroke" d="M63 197.8h22.6c0-39.1 29.8-70.9 66.4-70.9v-22.6c-49.1 0-89 41.9-89 93.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bell</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/bell.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/bell.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 426.46" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/box.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M411.56 426.46H100.44a65.1 65.1 0 01-65-65V58.82a14.71 14.71 0 0129.41 0v302.62a35.65 35.65 0 0035.61 35.61h311.1a35.65 35.65 0 0035.61-35.61V174a14.71 14.71 0 1129.41 0v187.44a65.1 65.1 0 01-65.02 65.02z"></path><path class="lineal-fill" d="M14.71 14.7H497.3v102.14H14.71z"></path><path class="lineal-stroke" d="M497.29 131.56H14.71A14.71 14.71 0 010 116.85V14.71A14.71 14.71 0 0114.71 0h482.58A14.71 14.71 0 01512 14.71v102.14a14.71 14.71 0 01-14.71 14.71zM29.41 102.15h453.18V29.41H29.41zm305.26 133.14H177.33a14.71 14.71 0 01-14.71-14.71v-44.11a14.71 14.71 0 1129.41 0v29.41H320v-29.41a14.71 14.71 0 1129.41 0v44.11a14.71 14.71 0 01-14.74 14.71z"></path><path class="lineal-fill" d="M50.12 352.93v8.51a50.31 50.31 0 0050.32 50.31h311.12a50.31 50.31 0 0050.32-50.31v-8.51z"></path><path class="lineal-stroke" d="M411.56 426.46H100.44a65.1 65.1 0 01-65-65v-8.51a14.7 14.7 0 0114.7-14.7h411.74a14.7 14.7 0 0114.7 14.7v8.51a65.1 65.1 0 01-65.02 65zM65.37 367.64a35.67 35.67 0 0035.07 29.41h311.12a35.67 35.67 0 0035.07-29.41z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 426.46" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/box.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M411.56 426.46H100.44a65.1 65.1 0 01-65-65V58.82a14.71 14.71 0 0129.41 0v302.62a35.65 35.65 0 0035.61 35.61h311.1a35.65 35.65 0 0035.61-35.61V174a14.71 14.71 0 1129.41 0v187.44a65.1 65.1 0 01-65.02 65.02z"></path><path class="lineal-fill" d="M14.71 14.7H497.3v102.14H14.71z"></path><path class="lineal-stroke" d="M497.29 131.56H14.71A14.71 14.71 0 010 116.85V14.71A14.71 14.71 0 0114.71 0h482.58A14.71 14.71 0 01512 14.71v102.14a14.71 14.71 0 01-14.71 14.71zM29.41 102.15h453.18V29.41H29.41zm305.26 133.14H177.33a14.71 14.71 0 01-14.71-14.71v-44.11a14.71 14.71 0 1129.41 0v29.41H320v-29.41a14.71 14.71 0 1129.41 0v44.11a14.71 14.71 0 01-14.74 14.71z"></path><path class="lineal-fill" d="M50.12 352.93v8.51a50.31 50.31 0 0050.32 50.31h311.12a50.31 50.31 0 0050.32-50.31v-8.51z"></path><path class="lineal-stroke" d="M411.56 426.46H100.44a65.1 65.1 0 01-65-65v-8.51a14.7 14.7 0 0114.7-14.7h411.74a14.7 14.7 0 0114.7 14.7v8.51a65.1 65.1 0 01-65.02 65zM65.37 367.64a35.67 35.67 0 0035.07 29.41h311.12a35.67 35.67 0 0035.07-29.41z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">box</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/box.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/box.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 400.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M238.7 258.9h-67.8c-22.3 0-40.5-18.1-40.5-40.4v-39.8h148.7v39.8c.1 22.3-18.1 40.4-40.4 40.4z"></path><path class="lineal-stroke" d="M238.7 270.2h-67.8c-28.6 0-51.7-23.2-51.7-51.7v-39.8c0-6.2 5-11.3 11.3-11.3h148.7c6.2 0 11.3 5 11.3 11.3v39.8c-.1 28.5-23.2 51.6-51.8 51.7zm-97-80.3v28.6c0 16.1 13.1 29.2 29.2 29.2h67.8c16.1 0 29.2-13.1 29.2-29.2v-28.6H141.7z"></path><path class="lineal-fill" d="M310.8 36.9l-22-22c-2.3-2.4-5.5-3.7-8.8-3.7H129.6c-3.3 0-6.4 1.3-8.8 3.6l-22 22c-2.3 2.3-3.6 5.5-3.6 8.8v79.6h219.2V45.7c0-3.3-1.3-6.4-3.6-8.8zm-40.7 77.4H139.5V58.9l3.4-3.3h124l3.4 3.3-.2 55.4z"></path><path class="lineal-stroke" d="M314.4 136.6H95.2c-6.2 0-11.3-5-11.3-11.3V45.7c0-6.3 2.5-12.3 6.9-16.7l22-22c4.4-4.5 10.4-7 16.7-7H280c6.3 0 12.3 2.5 16.7 6.9l22 22c4.4 4.4 6.9 10.4 6.9 16.7v79.6c0 6.3-5 11.4-11.2 11.4zm-33-22.5h21.8V45.7c0-.3-.1-.6-.3-.8l-22-22c-.2-.2-.5-.3-.8-.3H129.6c-.3 0-.6.1-.8.3l-22 22c-.2.2-.3.5-.3.8v68.4h21.8V58.9c0-3 1.2-5.9 3.3-8l3.4-3.3c2.1-2.1 5-3.3 8-3.3h124c3 0 5.9 1.2 8 3.3l3.2 3.4c2.1 2.1 3.3 5 3.3 8l-.1 55.1zM150.7 103h108.1V66.8H150.7V103z"></path><path class="lineal-stroke" d="M362.5 400.7H47c-25.9 0-47-21.1-47-47V137.8c0-26 21.1-47 47-47h315.5c26 0 47 21.1 47 47.1V194c.2 6.2-4.7 11.4-10.9 11.6-6.2.2-11.4-4.7-11.6-10.9v-56.9c0-13.5-11-24.5-24.5-24.5H47c-13.5 0-24.5 11-24.5 24.5v215.8c0 13.5 11 24.5 24.5 24.5h315.5c13.5 0 24.5-11 24.5-24.5V256c-.2-6.2 4.7-11.4 10.9-11.6 6.2-.2 11.4 4.7 11.6 10.9v98.3c.1 26-21 47-47 47.1z"></path><path class="lineal-fill" d="M398.3 194v-56.2c0-19.8-16-35.8-35.7-35.8H47c-19.8 0-35.8 16-35.8 35.8V194h387.1z"></path><path class="lineal-stroke" d="M398.3 205.3h-387C5 205.3 0 200.2 0 194v-56.2c0-26 21.1-47 47-47h315.5c26 0 47 21.1 47 47.1V194c.1 6.2-4.9 11.3-11.2 11.3zM22.5 182.7H387v-44.9c0-13.5-11-24.5-24.5-24.5H47c-13.5 0-24.5 11-24.5 24.5v44.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 400.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M238.7 258.9h-67.8c-22.3 0-40.5-18.1-40.5-40.4v-39.8h148.7v39.8c.1 22.3-18.1 40.4-40.4 40.4z"></path><path class="lineal-stroke" d="M238.7 270.2h-67.8c-28.6 0-51.7-23.2-51.7-51.7v-39.8c0-6.2 5-11.3 11.3-11.3h148.7c6.2 0 11.3 5 11.3 11.3v39.8c-.1 28.5-23.2 51.6-51.8 51.7zm-97-80.3v28.6c0 16.1 13.1 29.2 29.2 29.2h67.8c16.1 0 29.2-13.1 29.2-29.2v-28.6H141.7z"></path><path class="lineal-fill" d="M310.8 36.9l-22-22c-2.3-2.4-5.5-3.7-8.8-3.7H129.6c-3.3 0-6.4 1.3-8.8 3.6l-22 22c-2.3 2.3-3.6 5.5-3.6 8.8v79.6h219.2V45.7c0-3.3-1.3-6.4-3.6-8.8zm-40.7 77.4H139.5V58.9l3.4-3.3h124l3.4 3.3-.2 55.4z"></path><path class="lineal-stroke" d="M314.4 136.6H95.2c-6.2 0-11.3-5-11.3-11.3V45.7c0-6.3 2.5-12.3 6.9-16.7l22-22c4.4-4.5 10.4-7 16.7-7H280c6.3 0 12.3 2.5 16.7 6.9l22 22c4.4 4.4 6.9 10.4 6.9 16.7v79.6c0 6.3-5 11.4-11.2 11.4zm-33-22.5h21.8V45.7c0-.3-.1-.6-.3-.8l-22-22c-.2-.2-.5-.3-.8-.3H129.6c-.3 0-.6.1-.8.3l-22 22c-.2.2-.3.5-.3.8v68.4h21.8V58.9c0-3 1.2-5.9 3.3-8l3.4-3.3c2.1-2.1 5-3.3 8-3.3h124c3 0 5.9 1.2 8 3.3l3.2 3.4c2.1 2.1 3.3 5 3.3 8l-.1 55.1zM150.7 103h108.1V66.8H150.7V103z"></path><path class="lineal-stroke" d="M362.5 400.7H47c-25.9 0-47-21.1-47-47V137.8c0-26 21.1-47 47-47h315.5c26 0 47 21.1 47 47.1V194c.2 6.2-4.7 11.4-10.9 11.6-6.2.2-11.4-4.7-11.6-10.9v-56.9c0-13.5-11-24.5-24.5-24.5H47c-13.5 0-24.5 11-24.5 24.5v215.8c0 13.5 11 24.5 24.5 24.5h315.5c13.5 0 24.5-11 24.5-24.5V256c-.2-6.2 4.7-11.4 10.9-11.6 6.2-.2 11.4 4.7 11.6 10.9v98.3c.1 26-21 47-47 47.1z"></path><path class="lineal-fill" d="M398.3 194v-56.2c0-19.8-16-35.8-35.7-35.8H47c-19.8 0-35.8 16-35.8 35.8V194h387.1z"></path><path class="lineal-stroke" d="M398.3 205.3h-387C5 205.3 0 200.2 0 194v-56.2c0-26 21.1-47 47-47h315.5c26 0 47 21.1 47 47.1V194c.1 6.2-4.9 11.3-11.2 11.3zM22.5 182.7H387v-44.9c0-13.5-11-24.5-24.5-24.5H47c-13.5 0-24.5 11-24.5 24.5v44.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">briefcase</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/briefcase.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/briefcase.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">briefcase-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/briefcase-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/briefcase-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 442.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/browser.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M464.2 442.8H47.7C21.4 442.8 0 421.4 0 395.1V47.7C0 21.4 21.4 0 47.7 0h416.5C490.6 0 512 21.4 512 47.7c0 7.6-6.2 13.8-13.8 13.9-7.6 0-13.8-6.2-13.9-13.8 0-11.1-9-20-20.1-20.1H47.7c-11.1 0-20 9-20.1 20.1v347.3c0 11.1 9 20.1 20.1 20.1h416.5c11.1 0 20.1-9 20.1-20.1V209.4c0-7.6 6.2-13.8 13.8-13.9 7.6 0 13.8 6.2 13.9 13.8V395c0 26.4-21.4 47.8-47.8 47.8z"></path><path class="lineal-fill" d="M13.8 47.7v69.9h484.3V47.7c0-18.7-15.2-33.9-33.9-33.9H47.7C29 13.8 13.8 29 13.8 47.7z"></path><path class="lineal-stroke" d="M498.2 131.5H13.8c-7.6 0-13.8-6.2-13.8-13.8v-70C0 21.4 21.4 0 47.7 0h416.5C490.6 0 512 21.4 512 47.7v69.9c0 7.7-6.2 13.9-13.8 13.9zM27.7 103.8h456.6v-56c0-11.1-9-20.1-20.1-20.1H47.8c-11.1 0-20 9-20.1 20v56.1z"></path><path class="lineal-stroke" d="M294.7 79.6h-26.3c-7.6 0-13.8-6.2-13.8-13.8S260.8 52 268.4 52h26.3c7.6 0 13.8 6.2 13.8 13.8.1 7.6-6.1 13.8-13.8 13.8zm73.4 0h-26.3c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8h26.3c7.6 0 13.8 6.2 13.8 13.8 0 7.6-6.2 13.8-13.8 13.8zm73.3 0h-26.3c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8h26.3c7.6 0 13.8 6.2 13.8 13.8.1 7.6-6.1 13.8-13.8 13.8z"></path><path class="lineal-fill" d="M112.8 268.5h286.4v63.6H112.8z"></path><path class="lineal-stroke" d="M399.2 345.9H112.8c-7.6 0-13.8-6.2-13.8-13.8v-63.7c0-7.6 6.2-13.8 13.8-13.8h286.4c7.6 0 13.8 6.2 13.8 13.8v63.7c.1 7.6-6.1 13.8-13.8 13.8zm-272.6-27.6h258.8v-36H126.6v36zm230.9-95.5h-203c-7.6.2-14-5.8-14.2-13.5s5.8-14 13.5-14.2h203.8c7.6-.2 14 5.8 14.2 13.5s-5.8 14-13.5 14.2h-.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 442.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/browser.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M464.2 442.8H47.7C21.4 442.8 0 421.4 0 395.1V47.7C0 21.4 21.4 0 47.7 0h416.5C490.6 0 512 21.4 512 47.7c0 7.6-6.2 13.8-13.8 13.9-7.6 0-13.8-6.2-13.9-13.8 0-11.1-9-20-20.1-20.1H47.7c-11.1 0-20 9-20.1 20.1v347.3c0 11.1 9 20.1 20.1 20.1h416.5c11.1 0 20.1-9 20.1-20.1V209.4c0-7.6 6.2-13.8 13.8-13.9 7.6 0 13.8 6.2 13.9 13.8V395c0 26.4-21.4 47.8-47.8 47.8z"></path><path class="lineal-fill" d="M13.8 47.7v69.9h484.3V47.7c0-18.7-15.2-33.9-33.9-33.9H47.7C29 13.8 13.8 29 13.8 47.7z"></path><path class="lineal-stroke" d="M498.2 131.5H13.8c-7.6 0-13.8-6.2-13.8-13.8v-70C0 21.4 21.4 0 47.7 0h416.5C490.6 0 512 21.4 512 47.7v69.9c0 7.7-6.2 13.9-13.8 13.9zM27.7 103.8h456.6v-56c0-11.1-9-20.1-20.1-20.1H47.8c-11.1 0-20 9-20.1 20v56.1z"></path><path class="lineal-stroke" d="M294.7 79.6h-26.3c-7.6 0-13.8-6.2-13.8-13.8S260.8 52 268.4 52h26.3c7.6 0 13.8 6.2 13.8 13.8.1 7.6-6.1 13.8-13.8 13.8zm73.4 0h-26.3c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8h26.3c7.6 0 13.8 6.2 13.8 13.8 0 7.6-6.2 13.8-13.8 13.8zm73.3 0h-26.3c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8h26.3c7.6 0 13.8 6.2 13.8 13.8.1 7.6-6.1 13.8-13.8 13.8z"></path><path class="lineal-fill" d="M112.8 268.5h286.4v63.6H112.8z"></path><path class="lineal-stroke" d="M399.2 345.9H112.8c-7.6 0-13.8-6.2-13.8-13.8v-63.7c0-7.6 6.2-13.8 13.8-13.8h286.4c7.6 0 13.8 6.2 13.8 13.8v63.7c.1 7.6-6.1 13.8-13.8 13.8zm-272.6-27.6h258.8v-36H126.6v36zm230.9-95.5h-203c-7.6.2-14-5.8-14.2-13.5s5.8-14 13.5-14.2h203.8c7.6-.2 14 5.8 14.2 13.5s-5.8 14-13.5 14.2h-.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">browser</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/browser.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/browser.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 446" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/browser-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M472.9 244.5c-22.2 0-42.4-12.8-51.9-32.9h-27c-13.4 28.4-47.2 40.7-75.8 27.6v109.9c0 44.9 89.2 81.7 89.2 81.7s89.2-36.8 89.2-81.7V239.3c-7.3 3.4-15.4 5.2-23.7 5.2z"></path><path class="lineal-stroke" d="M407.6 446c-2 0-3.9-.4-5.8-1.1-10.1-4.2-98.6-42.2-98.6-95.7V239.3c0-8.4 6.8-15.2 15.2-15.2 2.2 0 4.3.5 6.3 1.4 5.5 2.5 11.5 3.8 17.6 3.8 16.3 0 31.2-9.5 38.2-24.2 2.5-5.3 7.8-8.7 13.7-8.7h26.9c5.9 0 11.2 3.4 13.7 8.7 7 14.7 21.9 24.1 38.2 24.2 6.1 0 12.1-1.3 17.6-3.8 7.6-3.5 16.6-.2 20.1 7.5.9 2 1.4 4.1 1.4 6.3v109.9c0 53.5-88.5 91.5-98.6 95.7-2 .7-3.9 1.1-5.9 1.1zm-74.1-186.9v90.1c0 24.4 46.6 52.7 74.1 65.2 27.5-12.5 74.1-40.8 74.1-65.2v-90.1c-27.4 3.3-54.3-9.2-69.5-32.3H403c-15.1 23.1-42 35.6-69.5 32.3z"></path><path class="lineal-fill" d="M15.1 15.1h392.4v85.5H15.1z"></path><path class="lineal-stroke" d="M407.6 0H15.1C6.8 0 0 6.8 0 15.1v354.1c0 8.4 6.8 15.1 15.1 15.1h243.6c8.4-.2 15-7.2 14.8-15.5-.2-8.1-6.7-14.6-14.8-14.8H30.3V115.8h362.1v33.5c0 8.4 6.8 15.2 15.1 15.2 8.4 0 15.2-6.8 15.2-15.1V15.1C422.8 6.8 416 0 407.6 0zM30.3 85.5V30.3h362.1v55.2H30.3z"></path><path class="lineal-stroke" d="M267.4 73.1h-26c-8.4-.2-15-7.2-14.8-15.5.2-8.1 6.7-14.6 14.8-14.8h26c8.4-.2 15.3 6.4 15.5 14.8.2 8.4-6.4 15.3-14.8 15.5h-.7zm86.7 0H328c-8.4-.2-15-7.2-14.8-15.5.2-8.1 6.7-14.6 14.8-14.8h26c8.4-.2 15.3 6.4 15.5 14.8.2 8.4-6.4 15.3-14.8 15.5h-.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 446" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/browser-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M472.9 244.5c-22.2 0-42.4-12.8-51.9-32.9h-27c-13.4 28.4-47.2 40.7-75.8 27.6v109.9c0 44.9 89.2 81.7 89.2 81.7s89.2-36.8 89.2-81.7V239.3c-7.3 3.4-15.4 5.2-23.7 5.2z"></path><path class="lineal-stroke" d="M407.6 446c-2 0-3.9-.4-5.8-1.1-10.1-4.2-98.6-42.2-98.6-95.7V239.3c0-8.4 6.8-15.2 15.2-15.2 2.2 0 4.3.5 6.3 1.4 5.5 2.5 11.5 3.8 17.6 3.8 16.3 0 31.2-9.5 38.2-24.2 2.5-5.3 7.8-8.7 13.7-8.7h26.9c5.9 0 11.2 3.4 13.7 8.7 7 14.7 21.9 24.1 38.2 24.2 6.1 0 12.1-1.3 17.6-3.8 7.6-3.5 16.6-.2 20.1 7.5.9 2 1.4 4.1 1.4 6.3v109.9c0 53.5-88.5 91.5-98.6 95.7-2 .7-3.9 1.1-5.9 1.1zm-74.1-186.9v90.1c0 24.4 46.6 52.7 74.1 65.2 27.5-12.5 74.1-40.8 74.1-65.2v-90.1c-27.4 3.3-54.3-9.2-69.5-32.3H403c-15.1 23.1-42 35.6-69.5 32.3z"></path><path class="lineal-fill" d="M15.1 15.1h392.4v85.5H15.1z"></path><path class="lineal-stroke" d="M407.6 0H15.1C6.8 0 0 6.8 0 15.1v354.1c0 8.4 6.8 15.1 15.1 15.1h243.6c8.4-.2 15-7.2 14.8-15.5-.2-8.1-6.7-14.6-14.8-14.8H30.3V115.8h362.1v33.5c0 8.4 6.8 15.2 15.1 15.2 8.4 0 15.2-6.8 15.2-15.1V15.1C422.8 6.8 416 0 407.6 0zM30.3 85.5V30.3h362.1v55.2H30.3z"></path><path class="lineal-stroke" d="M267.4 73.1h-26c-8.4-.2-15-7.2-14.8-15.5.2-8.1 6.7-14.6 14.8-14.8h26c8.4-.2 15.3 6.4 15.5 14.8.2 8.4-6.4 15.3-14.8 15.5h-.7zm86.7 0H328c-8.4-.2-15-7.2-14.8-15.5.2-8.1 6.7-14.6 14.8-14.8h26c8.4-.2 15.3 6.4 15.5 14.8.2 8.4-6.4 15.3-14.8 15.5h-.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">browser-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/browser-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/browser-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 287.1 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/brush.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M272.7 287.6c-.2-2.6-1.1-5.1-2.7-7.1-1.8-2-4.4-3.2-7.1-3.3-55.5-.3-91.8-44.8-91.8-84.2-.3-26 19.8-121.8 19.9-131.2.2-26.2-20.9-47.5-47.1-47.7h-.3c-26.2 0-47.4 21.2-47.4 47.4v.3C96.3 71.1 116.3 167 116 193c0 39.4-36.3 83.9-91.8 84.2-2.7.1-5.3 1.3-7.1 3.3-1.6 2-2.6 4.5-2.7 7.1l-.2 78.6h258.7l-.2-78.6z"></path><path class="lineal-stroke" d="M287.1 366.2l-.1-78.7c-.2-5.7-2.2-11.1-5.6-15.6-.4-.5-.8-1-1.3-1.5-4.5-4.7-10.6-7.4-17.1-7.5-45.8-.2-77.6-37-77.6-69.9v-.1c-.2-15.2 8.1-61 13.6-91.4 4.6-25.8 6.3-35.3 6.3-39.5 0-34-27.6-61.6-61.6-61.6S82 28 82 62c0 4.2 1.7 13.7 6.3 39.5 5.5 30.4 13.7 76.2 13.6 91.4v.1c0 32.9-31.9 69.7-77.6 69.9-6.5.1-12.7 2.8-17.2 7.5-.5.5-.9 1-1.4 1.5-3.5 4.5-5.4 10-5.6 15.6L0 366.2v131.5c0 7.9 6.4 14.2 14.2 14.2h133.6c4.5 0 8.8-2.2 11.5-5.8l38.5-52.4c0-.1.1-.1.1-.2l.4-.7c.1-.2.2-.4.3-.5s.2-.4.4-.7.2-.4.3-.6.2-.4.3-.7.2-.4.2-.7.1-.4.2-.6.1-.5.2-.7.1-.4.1-.6.1-.5.1-.8 0-.4.1-.6 0-.5 0-.8v-32.1c0-7.9-6.4-14.2-14.2-14.2-7.9 0-14.2 6.4-14.2 14.2v27.1l-31.4 42.8H28.5v-103h230.2v103h-33.9c-7.9 0-14.2 6.4-14.2 14.2 0 7.9 6.4 14.2 14.2 14.2h48.1c7.9 0 14.2-6.4 14.2-14.2V366.2zM28.5 352l.1-60.6c61-2.5 101.6-52.1 101.7-98.2.1-16.6-6.3-53.6-14-96.7-2.6-14.7-5.6-31.3-5.8-34.8 0-18.3 14.8-33.1 33.1-33.1s33.1 14.8 33.1 33.1c-.2 3.4-3.2 20.1-5.9 34.8-7.8 43.1-14.2 80.1-14 96.7 0 46.1 40.7 95.7 101.7 98.2l.1 60.7-230.1-.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 287.1 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/brush.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M272.7 287.6c-.2-2.6-1.1-5.1-2.7-7.1-1.8-2-4.4-3.2-7.1-3.3-55.5-.3-91.8-44.8-91.8-84.2-.3-26 19.8-121.8 19.9-131.2.2-26.2-20.9-47.5-47.1-47.7h-.3c-26.2 0-47.4 21.2-47.4 47.4v.3C96.3 71.1 116.3 167 116 193c0 39.4-36.3 83.9-91.8 84.2-2.7.1-5.3 1.3-7.1 3.3-1.6 2-2.6 4.5-2.7 7.1l-.2 78.6h258.7l-.2-78.6z"></path><path class="lineal-stroke" d="M287.1 366.2l-.1-78.7c-.2-5.7-2.2-11.1-5.6-15.6-.4-.5-.8-1-1.3-1.5-4.5-4.7-10.6-7.4-17.1-7.5-45.8-.2-77.6-37-77.6-69.9v-.1c-.2-15.2 8.1-61 13.6-91.4 4.6-25.8 6.3-35.3 6.3-39.5 0-34-27.6-61.6-61.6-61.6S82 28 82 62c0 4.2 1.7 13.7 6.3 39.5 5.5 30.4 13.7 76.2 13.6 91.4v.1c0 32.9-31.9 69.7-77.6 69.9-6.5.1-12.7 2.8-17.2 7.5-.5.5-.9 1-1.4 1.5-3.5 4.5-5.4 10-5.6 15.6L0 366.2v131.5c0 7.9 6.4 14.2 14.2 14.2h133.6c4.5 0 8.8-2.2 11.5-5.8l38.5-52.4c0-.1.1-.1.1-.2l.4-.7c.1-.2.2-.4.3-.5s.2-.4.4-.7.2-.4.3-.6.2-.4.3-.7.2-.4.2-.7.1-.4.2-.6.1-.5.2-.7.1-.4.1-.6.1-.5.1-.8 0-.4.1-.6 0-.5 0-.8v-32.1c0-7.9-6.4-14.2-14.2-14.2-7.9 0-14.2 6.4-14.2 14.2v27.1l-31.4 42.8H28.5v-103h230.2v103h-33.9c-7.9 0-14.2 6.4-14.2 14.2 0 7.9 6.4 14.2 14.2 14.2h48.1c7.9 0 14.2-6.4 14.2-14.2V366.2zM28.5 352l.1-60.6c61-2.5 101.6-52.1 101.7-98.2.1-16.6-6.3-53.6-14-96.7-2.6-14.7-5.6-31.3-5.8-34.8 0-18.3 14.8-33.1 33.1-33.1s33.1 14.8 33.1 33.1c-.2 3.4-3.2 20.1-5.9 34.8-7.8 43.1-14.2 80.1-14 96.7 0 46.1 40.7 95.7 101.7 98.2l.1 60.7-230.1-.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">brush</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/brush.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/brush.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 450.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bucket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M262.1 105.6v107.9c0 19.4-15.8 35.2-35.2 35.2h-1.4c-17.4 0-32.1-12.7-34.8-29.8v43.6c0 19.4-15.8 35.2-35.2 35.2h-1.4c-19.4 0-35.2-15.8-35.2-35.2v-43.6c-2.7 17.2-17.4 29.8-34.8 29.8h-1.4c-19.4 0-35.2-15.8-35.2-35.2V105.6h-.3v329.1h417.6V105.6H262.1z"></path><path class="lineal-stroke" d="M496 0h-80.8c-8.8 0-16 7.2-16 16s7.2 16 16 16H480v57.6H32V32h271.2c8.8 0 16-7.2 16-16s-7.2-16-16-16H16C7.2 0 0 7.2 0 16v95.5c0 42.8 10.7 84.9 31.2 122.4v200.8c0 8.8 7.2 16 16 16h417.6c8.8 0 16-7.2 16-16V233.9c20.5-37.5 31.2-79.6 31.2-122.4V16c0-8.8-7.2-16-16-16zM278.1 213.5v-91.9h170.7v103.8C409.8 291.3 338 335.5 256 335.5c-33.5.1-66.6-7.5-96.8-22 26.8-2 47.5-24.2 47.5-51v-1.4c6 2.4 12.4 3.6 18.8 3.6h1.4c28.3 0 51.2-22.9 51.2-51.2zM105 276.8c-4.5-4.1-8.8-8.3-12.9-12.8 3.7-.6 7.3-1.6 10.8-3v1.4c0 4.9.7 9.7 2.1 14.4zM63.5 121.6h182.6v91.9c0 10.6-8.6 19.2-19.2 19.2h-1.4c-9.5 0-17.5-6.9-19-16.2-1.4-8.7-9.5-14.7-18.3-13.4-7.8 1.2-13.5 7.9-13.5 15.8v43.6c0 10.6-8.6 19.2-19.2 19.2h-1.4c-10.6 0-19.2-8.6-19.2-19.2v-43.6c0-8.4-6.4-15.4-14.8-16h-2.8l-.8.1-.6.1-.8.2-.6.2c-.3.1-.5.2-.8.2l-.6.2-.7.3-.6.3-.6.4-.6.4-.6.4c-.2.1-.4.3-.6.4l-.5.4-.6.5-.5.4-.6.6-.4.4c-.2.2-.4.4-.5.7l-.3.5c-.2.2-.3.5-.5.7l-.3.5c-.1.3-.3.5-.4.8l-.2.5c-.1.3-.2.6-.4.9s-.1.3-.2.5c-.1.3-.2.7-.3 1 0 .1-.1.3-.1.4l-.3 1.5c-1.5 9.3-9.5 16.2-19 16.2h-1.4c-10.6 0-19.2-8.6-19.2-19.2v-91.8zm385.3 297.1H63.2V279.8c92.7 106.5 254.2 117.6 360.7 24.9 8.9-7.7 17.2-16.1 24.9-24.9v138.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 450.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/bucket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M262.1 105.6v107.9c0 19.4-15.8 35.2-35.2 35.2h-1.4c-17.4 0-32.1-12.7-34.8-29.8v43.6c0 19.4-15.8 35.2-35.2 35.2h-1.4c-19.4 0-35.2-15.8-35.2-35.2v-43.6c-2.7 17.2-17.4 29.8-34.8 29.8h-1.4c-19.4 0-35.2-15.8-35.2-35.2V105.6h-.3v329.1h417.6V105.6H262.1z"></path><path class="lineal-stroke" d="M496 0h-80.8c-8.8 0-16 7.2-16 16s7.2 16 16 16H480v57.6H32V32h271.2c8.8 0 16-7.2 16-16s-7.2-16-16-16H16C7.2 0 0 7.2 0 16v95.5c0 42.8 10.7 84.9 31.2 122.4v200.8c0 8.8 7.2 16 16 16h417.6c8.8 0 16-7.2 16-16V233.9c20.5-37.5 31.2-79.6 31.2-122.4V16c0-8.8-7.2-16-16-16zM278.1 213.5v-91.9h170.7v103.8C409.8 291.3 338 335.5 256 335.5c-33.5.1-66.6-7.5-96.8-22 26.8-2 47.5-24.2 47.5-51v-1.4c6 2.4 12.4 3.6 18.8 3.6h1.4c28.3 0 51.2-22.9 51.2-51.2zM105 276.8c-4.5-4.1-8.8-8.3-12.9-12.8 3.7-.6 7.3-1.6 10.8-3v1.4c0 4.9.7 9.7 2.1 14.4zM63.5 121.6h182.6v91.9c0 10.6-8.6 19.2-19.2 19.2h-1.4c-9.5 0-17.5-6.9-19-16.2-1.4-8.7-9.5-14.7-18.3-13.4-7.8 1.2-13.5 7.9-13.5 15.8v43.6c0 10.6-8.6 19.2-19.2 19.2h-1.4c-10.6 0-19.2-8.6-19.2-19.2v-43.6c0-8.4-6.4-15.4-14.8-16h-2.8l-.8.1-.6.1-.8.2-.6.2c-.3.1-.5.2-.8.2l-.6.2-.7.3-.6.3-.6.4-.6.4-.6.4c-.2.1-.4.3-.6.4l-.5.4-.6.5-.5.4-.6.6-.4.4c-.2.2-.4.4-.5.7l-.3.5c-.2.2-.3.5-.5.7l-.3.5c-.1.3-.3.5-.4.8l-.2.5c-.1.3-.2.6-.4.9s-.1.3-.2.5c-.1.3-.2.7-.3 1 0 .1-.1.3-.1.4l-.3 1.5c-1.5 9.3-9.5 16.2-19 16.2h-1.4c-10.6 0-19.2-8.6-19.2-19.2v-91.8zm385.3 297.1H63.2V279.8c92.7 106.5 254.2 117.6 360.7 24.9 8.9-7.7 17.2-16.1 24.9-24.9v138.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bucket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/bucket.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/bucket.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 393.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cake.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M204.8 126.8c-6.5 0-11.7-5.2-11.7-11.7V69.5c0-6.5 5.2-11.7 11.7-11.7 6.5 0 11.7 5.2 11.7 11.7v45.6c0 6.5-5.2 11.7-11.7 11.7zm193.1 267.1H11.7c-6.5-.2-11.5-5.6-11.4-12 .2-6.2 5.2-11.2 11.4-11.4h386.2c6.5.2 11.5 5.6 11.4 12-.2 6.3-5.2 11.3-11.4 11.4z"></path><path class="lineal-fill" d="M375.2 380.2H34.4V277.8c0-22.1 17.9-40 40-40h260.8c22.1 0 40 17.9 40 40v102.4z"></path><path class="lineal-stroke" d="M375.2 391.9H34.4c-6.5 0-11.7-5.2-11.7-11.7V277.8c0-28.5 23.1-51.7 51.7-51.7h260.8c28.5 0 51.6 23.2 51.7 51.7v102.5c0 6.4-5.3 11.6-11.7 11.6zM46.1 368.6h317.4v-90.7c0-15.6-12.7-28.3-28.3-28.3H74.4c-15.6 0-28.3 12.7-28.3 28.3v90.7z"></path><path class="lineal-stroke" d="M239.9 309.6H34.4c-6.5-.2-11.5-5.6-11.4-12 .2-6.2 5.2-11.2 11.4-11.4h205.5c6.5.2 11.5 5.6 11.4 12-.2 6.2-5.2 11.2-11.4 11.4zm-166.8-64c-6.5 0-11.7-5.2-11.7-11.7V162c0-28.5 23.1-51.6 51.7-51.7h183.5c28.5 0 51.6 23.1 51.7 51.7v15.1c0 6.5-5.2 11.7-11.7 11.7H181.4c-6.5-.2-11.5-5.6-11.4-12 .2-6.2 5.2-11.2 11.4-11.4h143.4V162c0-15.6-12.7-28.3-28.3-28.3H113.1c-15.6 0-28.3 12.7-28.3 28.3v71.8c0 6.5-5.2 11.8-11.7 11.8z"></path><path class="lineal-fill" d="M225.7 50.5c0 11.5-9.4 20.9-20.9 20.9-11.5 0-20.9-9.3-20.9-20.9 0-17.2 15.1-38.8 20.9-38.8 6.1 0 20.9 21.6 20.9 38.8z"></path><path class="lineal-stroke" d="M204.8 83c-18 0-32.5-14.6-32.6-32.6 0-13.2 6.2-25.6 9.9-31.8C189.5 6.3 197.1 0 204.8 0c9.7 0 17.7 10.1 22.8 18.7 6.2 10.5 9.8 22.1 9.8 31.8-.1 17.9-14.6 32.5-32.6 32.5zm.1-56.4c-4.2 5.7-9.2 15.8-9.2 23.9.2 5.1 4.4 9 9.5 8.9 4.8-.2 8.7-4 8.9-8.9-.1-8.2-5.1-18.3-9.2-23.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 393.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cake.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M204.8 126.8c-6.5 0-11.7-5.2-11.7-11.7V69.5c0-6.5 5.2-11.7 11.7-11.7 6.5 0 11.7 5.2 11.7 11.7v45.6c0 6.5-5.2 11.7-11.7 11.7zm193.1 267.1H11.7c-6.5-.2-11.5-5.6-11.4-12 .2-6.2 5.2-11.2 11.4-11.4h386.2c6.5.2 11.5 5.6 11.4 12-.2 6.3-5.2 11.3-11.4 11.4z"></path><path class="lineal-fill" d="M375.2 380.2H34.4V277.8c0-22.1 17.9-40 40-40h260.8c22.1 0 40 17.9 40 40v102.4z"></path><path class="lineal-stroke" d="M375.2 391.9H34.4c-6.5 0-11.7-5.2-11.7-11.7V277.8c0-28.5 23.1-51.7 51.7-51.7h260.8c28.5 0 51.6 23.2 51.7 51.7v102.5c0 6.4-5.3 11.6-11.7 11.6zM46.1 368.6h317.4v-90.7c0-15.6-12.7-28.3-28.3-28.3H74.4c-15.6 0-28.3 12.7-28.3 28.3v90.7z"></path><path class="lineal-stroke" d="M239.9 309.6H34.4c-6.5-.2-11.5-5.6-11.4-12 .2-6.2 5.2-11.2 11.4-11.4h205.5c6.5.2 11.5 5.6 11.4 12-.2 6.2-5.2 11.2-11.4 11.4zm-166.8-64c-6.5 0-11.7-5.2-11.7-11.7V162c0-28.5 23.1-51.6 51.7-51.7h183.5c28.5 0 51.6 23.1 51.7 51.7v15.1c0 6.5-5.2 11.7-11.7 11.7H181.4c-6.5-.2-11.5-5.6-11.4-12 .2-6.2 5.2-11.2 11.4-11.4h143.4V162c0-15.6-12.7-28.3-28.3-28.3H113.1c-15.6 0-28.3 12.7-28.3 28.3v71.8c0 6.5-5.2 11.8-11.7 11.8z"></path><path class="lineal-fill" d="M225.7 50.5c0 11.5-9.4 20.9-20.9 20.9-11.5 0-20.9-9.3-20.9-20.9 0-17.2 15.1-38.8 20.9-38.8 6.1 0 20.9 21.6 20.9 38.8z"></path><path class="lineal-stroke" d="M204.8 83c-18 0-32.5-14.6-32.6-32.6 0-13.2 6.2-25.6 9.9-31.8C189.5 6.3 197.1 0 204.8 0c9.7 0 17.7 10.1 22.8 18.7 6.2 10.5 9.8 22.1 9.8 31.8-.1 17.9-14.6 32.5-32.6 32.5zm.1-56.4c-4.2 5.7-9.2 15.8-9.2 23.9.2 5.1 4.4 9 9.5 8.9 4.8-.2 8.7-4 8.9-8.9-.1-8.2-5.1-18.3-9.2-23.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cake</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cake.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cake.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 324.3 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/calculator.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M280 409.6H44.2C19.8 409.6 0 389.8 0 365.4V44.2C0 19.8 19.8 0 44.2 0H280c24.4 0 44.2 19.8 44.2 44.2v240.2c0 6.3-5.1 11.4-11.4 11.4s-11.4-5.1-11.4-11.4V44.2c0-11.9-9.6-21.5-21.5-21.5H44.2c-11.9 0-21.5 9.6-21.5 21.5v321.1c0 11.9 9.6 21.5 21.5 21.5H280c11.9 0 21.5-9.6 21.5-21.5v-24c0-6.3 5.1-11.4 11.4-11.4s11.4 5.1 11.4 11.4v24c-.1 24.5-19.9 44.3-44.3 44.3z"></path><path class="lineal-fill" d="M252 159.3H72.2c-6.9 0-12.5-5.6-12.5-12.5v-66c0-6.9 5.6-12.5 12.5-12.5H252c6.9 0 12.5 5.6 12.5 12.5v66c0 6.9-5.6 12.5-12.5 12.5z"></path><path class="lineal-stroke" d="M252 170.7H72.2c-13.2 0-23.9-10.7-23.9-23.9v-66c0-13.2 10.7-23.9 23.9-23.9H252c13.2 0 23.9 10.7 23.9 23.9v66c0 13.2-10.7 23.9-23.9 23.9zm-179.8-91c-.6 0-1.1.5-1.1 1.1v66c0 .6.5 1.1 1.1 1.1H252c.6 0 1.1-.5 1.1-1.1v-66c0-.6-.5-1.1-1.1-1.1H72.2zm131.4 177.4c-6.3 0-11.4-5.1-11.4-11.4 0-3 1.2-5.9 3.3-8l38.1-38.1c4.5-4.3 11.7-4.2 16.1.3 4.2 4.4 4.2 11.3 0 15.7l-38.1 38.1c-2.1 2.2-5 3.4-8 3.4z"></path><path class="lineal-stroke" d="M241.7 257.1c-3 0-5.9-1.2-8-3.3l-38.1-38.1c-4.4-4.4-4.4-11.7 0-16.1s11.7-4.4 16.1 0l38.1 38.1c4.4 4.4 4.4 11.7 0 16.1-2.2 2.1-5.1 3.3-8.1 3.3zm-113.1 79.5H74.7c-6.3-.2-11.2-5.4-11-11.7.2-6 5-10.9 11-11h53.8c6.3-.2 11.5 4.8 11.7 11 .2 6.3-4.8 11.5-11 11.7h-.6z"></path><path class="lineal-stroke" d="M101.6 363.6c-6.3 0-11.4-5.1-11.4-11.4v-53.9c0-6.3 5.1-11.4 11.4-11.4 6.3 0 11.4 5.1 11.4 11.4v53.9c0 6.3-5.1 11.4-11.4 11.4zm27-125.5H74.7c-6.3 0-11.4-5.1-11.4-11.4 0-6.3 5.1-11.4 11.4-11.4h53.8c6.3 0 11.4 5.1 11.4 11.4 0 6.3-5.1 11.4-11.3 11.4zm121 81.5h-53.9c-6.3.2-11.5-4.8-11.7-11-.2-6.3 4.8-11.5 11-11.7h54.5c6.3-.2 11.5 4.8 11.7 11 .2 6.3-4.8 11.5-11 11.7h-.6zm0 34.1h-53.9c-6.3 0-11.4-5.1-11.4-11.4s5.1-11.4 11.4-11.4h53.8c6.3 0 11.4 5.1 11.4 11.4s-5.1 11.4-11.3 11.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 324.3 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/calculator.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M280 409.6H44.2C19.8 409.6 0 389.8 0 365.4V44.2C0 19.8 19.8 0 44.2 0H280c24.4 0 44.2 19.8 44.2 44.2v240.2c0 6.3-5.1 11.4-11.4 11.4s-11.4-5.1-11.4-11.4V44.2c0-11.9-9.6-21.5-21.5-21.5H44.2c-11.9 0-21.5 9.6-21.5 21.5v321.1c0 11.9 9.6 21.5 21.5 21.5H280c11.9 0 21.5-9.6 21.5-21.5v-24c0-6.3 5.1-11.4 11.4-11.4s11.4 5.1 11.4 11.4v24c-.1 24.5-19.9 44.3-44.3 44.3z"></path><path class="lineal-fill" d="M252 159.3H72.2c-6.9 0-12.5-5.6-12.5-12.5v-66c0-6.9 5.6-12.5 12.5-12.5H252c6.9 0 12.5 5.6 12.5 12.5v66c0 6.9-5.6 12.5-12.5 12.5z"></path><path class="lineal-stroke" d="M252 170.7H72.2c-13.2 0-23.9-10.7-23.9-23.9v-66c0-13.2 10.7-23.9 23.9-23.9H252c13.2 0 23.9 10.7 23.9 23.9v66c0 13.2-10.7 23.9-23.9 23.9zm-179.8-91c-.6 0-1.1.5-1.1 1.1v66c0 .6.5 1.1 1.1 1.1H252c.6 0 1.1-.5 1.1-1.1v-66c0-.6-.5-1.1-1.1-1.1H72.2zm131.4 177.4c-6.3 0-11.4-5.1-11.4-11.4 0-3 1.2-5.9 3.3-8l38.1-38.1c4.5-4.3 11.7-4.2 16.1.3 4.2 4.4 4.2 11.3 0 15.7l-38.1 38.1c-2.1 2.2-5 3.4-8 3.4z"></path><path class="lineal-stroke" d="M241.7 257.1c-3 0-5.9-1.2-8-3.3l-38.1-38.1c-4.4-4.4-4.4-11.7 0-16.1s11.7-4.4 16.1 0l38.1 38.1c4.4 4.4 4.4 11.7 0 16.1-2.2 2.1-5.1 3.3-8.1 3.3zm-113.1 79.5H74.7c-6.3-.2-11.2-5.4-11-11.7.2-6 5-10.9 11-11h53.8c6.3-.2 11.5 4.8 11.7 11 .2 6.3-4.8 11.5-11 11.7h-.6z"></path><path class="lineal-stroke" d="M101.6 363.6c-6.3 0-11.4-5.1-11.4-11.4v-53.9c0-6.3 5.1-11.4 11.4-11.4 6.3 0 11.4 5.1 11.4 11.4v53.9c0 6.3-5.1 11.4-11.4 11.4zm27-125.5H74.7c-6.3 0-11.4-5.1-11.4-11.4 0-6.3 5.1-11.4 11.4-11.4h53.8c6.3 0 11.4 5.1 11.4 11.4 0 6.3-5.1 11.4-11.3 11.4zm121 81.5h-53.9c-6.3.2-11.5-4.8-11.7-11-.2-6.3 4.8-11.5 11-11.7h54.5c6.3-.2 11.5 4.8 11.7 11 .2 6.3-4.8 11.5-11 11.7h-.6zm0 34.1h-53.9c-6.3 0-11.4-5.1-11.4-11.4s5.1-11.4 11.4-11.4h53.8c6.3 0 11.4 5.1 11.4 11.4s-5.1 11.4-11.3 11.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">calculator</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/calculator.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/calculator.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 398.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/calendar.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M345.9 409.6H52.3C23.4 409.6 0 386.2 0 357.3v-198c0-6.3 5.1-11.4 11.4-11.4h375.5c6.3 0 11.4 5.1 11.4 11.4v56.9c0 6.3-5.1 11.4-11.4 11.4s-11.4-5.1-11.4-11.4v-45.5H22.8v186.6c0 16.3 13.2 29.5 29.5 29.5h293.6c16.3 0 29.5-13.2 29.5-29.5v-72.9c-.2-6.3 4.8-11.5 11-11.7 6.3-.2 11.5 4.8 11.7 11v73.6c.1 28.9-23.3 52.3-52.2 52.3zM117.1 108.1h-18c-17 0-30.8-13.8-30.8-30.8V30.8C68.3 13.8 82.1 0 99.1 0h18c17 0 30.8 13.8 30.8 30.8v46.5c0 17-13.8 30.8-30.8 30.8zm-18-85.3c-4.5 0-8.1 3.6-8.1 8v46.5c0 4.4 3.6 8.1 8.1 8.1h18c4.5 0 8.1-3.6 8.1-8.1V30.8c0-4.5-3.6-8.1-8.1-8.1h-18zm200 85.3h-18c-17 0-30.8-13.8-30.8-30.8V30.8c0-17 13.8-30.8 30.8-30.8h18c17 0 30.9 13.8 30.9 30.8v46.5c0 17-13.8 30.8-30.9 30.8zm-18-85.3c-4.4 0-8 3.6-8 8.1v46.5c0 4.4 3.6 8.1 8 8.1h18c4.5 0 8.1-3.6 8.1-8.1V30.8c0-4.4-3.6-8.1-8.1-8.1h-18z"></path><path class="lineal-fill" d="M345.9 45.5h-27.4v31.8c0 10.7-8.7 19.4-19.4 19.4h-18c-10.7 0-19.4-8.7-19.4-19.4V45.5H136.5v31.8c0 10.7-8.7 19.4-19.4 19.4h-18c-10.7 0-19.4-8.7-19.5-19.4V45.5H52.3c-22.6 0-40.9 18.3-40.9 40.9v72.9h375.5V86.4c-.1-22.6-18.4-40.9-41-40.9z"></path><path class="lineal-stroke" d="M386.8 170.7H11.4c-6.3 0-11.4-5.1-11.4-11.4V86.4c0-28.9 23.4-52.3 52.3-52.3h27.3c6.3 0 11.4 5.1 11.4 11.4v31.8c0 4.4 3.6 8.1 8.1 8.1h18c4.4 0 8.1-3.6 8.1-8.1V45.5c0-6.3 5.1-11.4 11.4-11.4h125.2c6.3 0 11.4 5.1 11.4 11.4v31.8c0 4.4 3.6 8.1 8 8.1h18c4.4 0 8.1-3.6 8.1-8.1V45.5c0-6.3 5.1-11.4 11.4-11.4h27.4c28.9 0 52.3 23.4 52.3 52.3v72.9c-.2 6.3-5.3 11.4-11.6 11.4zm-364-22.8h352.7V86.4c0-16.3-13.2-29.5-29.5-29.5h-16v20.4c0 17-13.8 30.8-30.8 30.8h-18c-17 0-30.8-13.8-30.8-30.8V56.9H147.9v20.4c0 17-13.8 30.8-30.8 30.8h-18c-17 0-30.8-13.8-30.8-30.8V56.9h-16c-16.3 0-29.5 13.2-29.5 29.5v61.5zM187 233.8l-6.8 4.2c-1.7 1.2-3.8 1.8-5.9 1.9-6.8 0-11.5-7.2-11.5-14.5-.1-5 2.5-9.8 6.8-12.4l30.9-18.7c2.1-1.2 4.4-1.7 6.8-1.6 7.5 0 16.1 4.4 16.1 11.5v148.7c0 7.5-9.1 11.2-18.2 11.2s-18.2-3.7-18.2-11.2V233.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 398.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/calendar.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M345.9 409.6H52.3C23.4 409.6 0 386.2 0 357.3v-198c0-6.3 5.1-11.4 11.4-11.4h375.5c6.3 0 11.4 5.1 11.4 11.4v56.9c0 6.3-5.1 11.4-11.4 11.4s-11.4-5.1-11.4-11.4v-45.5H22.8v186.6c0 16.3 13.2 29.5 29.5 29.5h293.6c16.3 0 29.5-13.2 29.5-29.5v-72.9c-.2-6.3 4.8-11.5 11-11.7 6.3-.2 11.5 4.8 11.7 11v73.6c.1 28.9-23.3 52.3-52.2 52.3zM117.1 108.1h-18c-17 0-30.8-13.8-30.8-30.8V30.8C68.3 13.8 82.1 0 99.1 0h18c17 0 30.8 13.8 30.8 30.8v46.5c0 17-13.8 30.8-30.8 30.8zm-18-85.3c-4.5 0-8.1 3.6-8.1 8v46.5c0 4.4 3.6 8.1 8.1 8.1h18c4.5 0 8.1-3.6 8.1-8.1V30.8c0-4.5-3.6-8.1-8.1-8.1h-18zm200 85.3h-18c-17 0-30.8-13.8-30.8-30.8V30.8c0-17 13.8-30.8 30.8-30.8h18c17 0 30.9 13.8 30.9 30.8v46.5c0 17-13.8 30.8-30.9 30.8zm-18-85.3c-4.4 0-8 3.6-8 8.1v46.5c0 4.4 3.6 8.1 8 8.1h18c4.5 0 8.1-3.6 8.1-8.1V30.8c0-4.4-3.6-8.1-8.1-8.1h-18z"></path><path class="lineal-fill" d="M345.9 45.5h-27.4v31.8c0 10.7-8.7 19.4-19.4 19.4h-18c-10.7 0-19.4-8.7-19.4-19.4V45.5H136.5v31.8c0 10.7-8.7 19.4-19.4 19.4h-18c-10.7 0-19.4-8.7-19.5-19.4V45.5H52.3c-22.6 0-40.9 18.3-40.9 40.9v72.9h375.5V86.4c-.1-22.6-18.4-40.9-41-40.9z"></path><path class="lineal-stroke" d="M386.8 170.7H11.4c-6.3 0-11.4-5.1-11.4-11.4V86.4c0-28.9 23.4-52.3 52.3-52.3h27.3c6.3 0 11.4 5.1 11.4 11.4v31.8c0 4.4 3.6 8.1 8.1 8.1h18c4.4 0 8.1-3.6 8.1-8.1V45.5c0-6.3 5.1-11.4 11.4-11.4h125.2c6.3 0 11.4 5.1 11.4 11.4v31.8c0 4.4 3.6 8.1 8 8.1h18c4.4 0 8.1-3.6 8.1-8.1V45.5c0-6.3 5.1-11.4 11.4-11.4h27.4c28.9 0 52.3 23.4 52.3 52.3v72.9c-.2 6.3-5.3 11.4-11.6 11.4zm-364-22.8h352.7V86.4c0-16.3-13.2-29.5-29.5-29.5h-16v20.4c0 17-13.8 30.8-30.8 30.8h-18c-17 0-30.8-13.8-30.8-30.8V56.9H147.9v20.4c0 17-13.8 30.8-30.8 30.8h-18c-17 0-30.8-13.8-30.8-30.8V56.9h-16c-16.3 0-29.5 13.2-29.5 29.5v61.5zM187 233.8l-6.8 4.2c-1.7 1.2-3.8 1.8-5.9 1.9-6.8 0-11.5-7.2-11.5-14.5-.1-5 2.5-9.8 6.8-12.4l30.9-18.7c2.1-1.2 4.4-1.7 6.8-1.6 7.5 0 16.1 4.4 16.1 11.5v148.7c0 7.5-9.1 11.2-18.2 11.2s-18.2-3.7-18.2-11.2V233.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">calendar</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/calendar.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/calendar.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 329.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/certificate.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M98.7 13.5v66.1c0 9.6-7.8 17.3-17.3 17.3H13.7c-1 0-1.8-.8-1.8-1.8v-.2C13 85.8 17.2 77.4 23.6 71l47.3-47.3c6.9-6.9 16-11.1 25.8-11.9 1-.1 1.9.6 2 1.6v.1z"></path><path class="lineal-stroke" d="M81.3 108.4H13.7C6.3 108.4.3 102.4.3 95c0-.6 0-1.1.1-1.7 1.5-11.6 6.7-22.4 15-30.7l47.3-47.3C71.5 6.5 83.2 1 95.7 0c7.4-.6 13.8 4.9 14.4 12.2v67.2c.1 16.1-12.8 29-28.8 29zM27 85.3h54.3c3.2 0 5.8-2.6 5.8-5.8V26.1c-3 1.4-5.7 3.4-8 5.7L31.8 79.1c-1.9 1.8-3.5 3.9-4.8 6.2zm233.1 9.3h-83.4c-6.4-.2-11.4-5.5-11.2-11.9.2-6.1 5.1-11 11.2-11.2h83.4c6.4-.2 11.7 4.8 11.9 11.2.2 6.4-4.8 11.7-11.2 11.9h-.7zm0 65.5H69.5c-6.4.2-11.7-4.8-11.9-11.2s4.8-11.7 11.2-11.9h191.3c6.4-.2 11.7 4.8 11.9 11.2s-4.8 11.7-11.2 11.9h-.7zm-107.2 65.5H69.5c-6.4.2-11.7-4.8-11.9-11.2s4.8-11.7 11.2-11.9h84.1c6.4.2 11.4 5.5 11.2 11.9-.2 6.1-5.1 11-11.2 11.2zm115 184c-2.8 0-5.6-.7-8-2.2l-23.6-13.9-23.6 13.9c-7.5 4.4-17.1 1.8-21.4-5.6-1.4-2.4-2.1-5.1-2.1-7.9v-37c-.2-6.4 4.8-11.7 11.2-11.9s11.7 4.8 11.9 11.2v24.7l16.2-9.5c4.9-2.9 11-2.9 15.9 0l16.2 9.5v-95.4c.2-6.4 5.5-11.4 11.9-11.2 6.1.2 11 5.1 11.2 11.2v108.4c-.1 8.7-7.2 15.7-15.8 15.7z"></path><path class="lineal-stroke" d="M283.7 333.5H272c-6.4-.2-11.4-5.5-11.2-11.9.2-6.1 5.1-11 11.2-11.2h11.7c12.6 0 22.7-10.2 22.8-22.7V45.9c0-12.6-10.2-22.8-22.8-22.8H99c-7.5.2-14.6 3.3-19.8 8.6L31.8 79.1c-5 5-8 11.6-8.6 18.7 0 .8-.1 1.5-.1 2.2v187.7c0 12.6 10.2 22.8 22.8 22.8h107c6.4 0 11.6 5.2 11.6 11.6 0 6.4-5.2 11.5-11.6 11.5h-107C20.6 333.5 0 313 0 287.7V100c0-1.3.1-2.6.2-3.9.9-12.6 6.4-24.4 15.3-33.3l47.3-47.3C72.2 5.9 84.9.4 98.3 0h185.4c25.3 0 45.9 20.5 45.9 45.9v241.8c0 25.3-20.6 45.8-45.9 45.8z"></path><path class="lineal-fill" d="M283.9 273.6c0 26.3-21.3 47.6-47.6 47.6s-47.6-21.3-47.6-47.6S210 226 236.3 226c26.3-.1 47.6 21.3 47.6 47.6z"></path><path class="lineal-stroke" d="M236.3 332.8c-32.7 0-59.2-26.5-59.2-59.2s26.5-59.2 59.2-59.2 59.2 26.5 59.2 59.2c-.1 32.7-26.6 59.1-59.2 59.2zm0-95.3c-19.9 0-36.1 16.2-36.1 36.1 0 19.9 16.2 36.1 36.1 36.1s36.1-16.2 36.1-36.1c-.1-20-16.2-36.1-36.1-36.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 329.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/certificate.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M98.7 13.5v66.1c0 9.6-7.8 17.3-17.3 17.3H13.7c-1 0-1.8-.8-1.8-1.8v-.2C13 85.8 17.2 77.4 23.6 71l47.3-47.3c6.9-6.9 16-11.1 25.8-11.9 1-.1 1.9.6 2 1.6v.1z"></path><path class="lineal-stroke" d="M81.3 108.4H13.7C6.3 108.4.3 102.4.3 95c0-.6 0-1.1.1-1.7 1.5-11.6 6.7-22.4 15-30.7l47.3-47.3C71.5 6.5 83.2 1 95.7 0c7.4-.6 13.8 4.9 14.4 12.2v67.2c.1 16.1-12.8 29-28.8 29zM27 85.3h54.3c3.2 0 5.8-2.6 5.8-5.8V26.1c-3 1.4-5.7 3.4-8 5.7L31.8 79.1c-1.9 1.8-3.5 3.9-4.8 6.2zm233.1 9.3h-83.4c-6.4-.2-11.4-5.5-11.2-11.9.2-6.1 5.1-11 11.2-11.2h83.4c6.4-.2 11.7 4.8 11.9 11.2.2 6.4-4.8 11.7-11.2 11.9h-.7zm0 65.5H69.5c-6.4.2-11.7-4.8-11.9-11.2s4.8-11.7 11.2-11.9h191.3c6.4-.2 11.7 4.8 11.9 11.2s-4.8 11.7-11.2 11.9h-.7zm-107.2 65.5H69.5c-6.4.2-11.7-4.8-11.9-11.2s4.8-11.7 11.2-11.9h84.1c6.4.2 11.4 5.5 11.2 11.9-.2 6.1-5.1 11-11.2 11.2zm115 184c-2.8 0-5.6-.7-8-2.2l-23.6-13.9-23.6 13.9c-7.5 4.4-17.1 1.8-21.4-5.6-1.4-2.4-2.1-5.1-2.1-7.9v-37c-.2-6.4 4.8-11.7 11.2-11.9s11.7 4.8 11.9 11.2v24.7l16.2-9.5c4.9-2.9 11-2.9 15.9 0l16.2 9.5v-95.4c.2-6.4 5.5-11.4 11.9-11.2 6.1.2 11 5.1 11.2 11.2v108.4c-.1 8.7-7.2 15.7-15.8 15.7z"></path><path class="lineal-stroke" d="M283.7 333.5H272c-6.4-.2-11.4-5.5-11.2-11.9.2-6.1 5.1-11 11.2-11.2h11.7c12.6 0 22.7-10.2 22.8-22.7V45.9c0-12.6-10.2-22.8-22.8-22.8H99c-7.5.2-14.6 3.3-19.8 8.6L31.8 79.1c-5 5-8 11.6-8.6 18.7 0 .8-.1 1.5-.1 2.2v187.7c0 12.6 10.2 22.8 22.8 22.8h107c6.4 0 11.6 5.2 11.6 11.6 0 6.4-5.2 11.5-11.6 11.5h-107C20.6 333.5 0 313 0 287.7V100c0-1.3.1-2.6.2-3.9.9-12.6 6.4-24.4 15.3-33.3l47.3-47.3C72.2 5.9 84.9.4 98.3 0h185.4c25.3 0 45.9 20.5 45.9 45.9v241.8c0 25.3-20.6 45.8-45.9 45.8z"></path><path class="lineal-fill" d="M283.9 273.6c0 26.3-21.3 47.6-47.6 47.6s-47.6-21.3-47.6-47.6S210 226 236.3 226c26.3-.1 47.6 21.3 47.6 47.6z"></path><path class="lineal-stroke" d="M236.3 332.8c-32.7 0-59.2-26.5-59.2-59.2s26.5-59.2 59.2-59.2 59.2 26.5 59.2 59.2c-.1 32.7-26.6 59.1-59.2 59.2zm0-95.3c-19.9 0-36.1 16.2-36.1 36.1 0 19.9 16.2 36.1 36.1 36.1s36.1-16.2 36.1-36.1c-.1-20-16.2-36.1-36.1-36.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">certificate</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/certificate.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/certificate.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 399" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/chat.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M33.9 263.5C-9.5 180.2 22.9 77.4 106.2 34s186.1-11.1 229.6 72.3 11.1 186.1-72.3 229.6c-55.3 28.8-121.8 25.1-173.6-9.7l-73.8 16.6 17.8-79.3z"></path><path class="lineal-stroke" d="M184.9 369.7c-34.5.1-68.4-9.6-97.7-27.9L19.3 357c-7.9 1.8-15.7-3.2-17.5-11.1-.5-2.1-.5-4.3 0-6.5l16.7-74.1C6.3 240.3 0 212.7 0 184.9 0 82.9 82.9 0 184.9 0s184.9 82.9 184.9 184.9-83 184.8-184.9 184.8zm-95-58.2c2.9 0 5.8.9 8.2 2.5 25.6 17.3 55.8 26.5 86.7 26.4 85.8 0 155.5-69.8 155.5-155.5S270.6 29.3 184.9 29.3 29.3 99.1 29.3 184.9c-.1 25 6 49.7 17.6 71.9 1.6 3.1 2.1 6.6 1.3 10l-12.7 56.6 51.2-11.5c1.1-.3 2.2-.5 3.2-.4z"></path><path class="lineal-stroke" d="M341.8 399c-9.9 0-19.8-.9-29.6-2.6-8-1.4-13.3-9-11.9-17 1.4-8 9-13.3 17-11.9 8.1 1.4 16.3 2.1 24.5 2.1 28 0 55.3-8.3 78.5-23.9 3.3-2.3 7.5-3 11.4-2.1l44.9 10.1-11.2-49.7c-.8-3.4-.3-6.9 1.3-10 36-69 9.1-154.1-59.9-190.1-4.5-2.3-9.1-4.4-13.8-6.3-7.5-2.9-11.3-11.5-8.3-19 2.9-7.5 11.5-11.3 19-8.3 87.6 34.3 130.8 133 96.6 220.6-1.6 4-3.3 7.9-5.1 11.7l15.1 67.3c1.8 7.9-3.2 15.7-11.1 17.5-2.1.5-4.3.5-6.5 0l-61.5-13.8c-26.7 16.7-57.8 25.5-89.4 25.4zm-67.9-195.6h-18.6c-8.1 0-14.7-6.6-14.7-14.7s6.6-14.7 14.7-14.7h18.6c8.1 0 14.7 6.6 14.7 14.7-.1 8.2-6.7 14.7-14.7 14.7zm-79 0h-18.6c-8.1 0-14.7-6.6-14.7-14.7s6.6-14.7 14.7-14.7h18.6c8.1 0 14.7 6.6 14.7 14.7 0 8.2-6.6 14.7-14.7 14.7zm-79 0H97.3c-8.1 0-14.7-6.6-14.7-14.7S89.2 174 97.3 174h18.6c8.1 0 14.7 6.6 14.7 14.7 0 8.2-6.6 14.7-14.7 14.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 399" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/chat.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M33.9 263.5C-9.5 180.2 22.9 77.4 106.2 34s186.1-11.1 229.6 72.3 11.1 186.1-72.3 229.6c-55.3 28.8-121.8 25.1-173.6-9.7l-73.8 16.6 17.8-79.3z"></path><path class="lineal-stroke" d="M184.9 369.7c-34.5.1-68.4-9.6-97.7-27.9L19.3 357c-7.9 1.8-15.7-3.2-17.5-11.1-.5-2.1-.5-4.3 0-6.5l16.7-74.1C6.3 240.3 0 212.7 0 184.9 0 82.9 82.9 0 184.9 0s184.9 82.9 184.9 184.9-83 184.8-184.9 184.8zm-95-58.2c2.9 0 5.8.9 8.2 2.5 25.6 17.3 55.8 26.5 86.7 26.4 85.8 0 155.5-69.8 155.5-155.5S270.6 29.3 184.9 29.3 29.3 99.1 29.3 184.9c-.1 25 6 49.7 17.6 71.9 1.6 3.1 2.1 6.6 1.3 10l-12.7 56.6 51.2-11.5c1.1-.3 2.2-.5 3.2-.4z"></path><path class="lineal-stroke" d="M341.8 399c-9.9 0-19.8-.9-29.6-2.6-8-1.4-13.3-9-11.9-17 1.4-8 9-13.3 17-11.9 8.1 1.4 16.3 2.1 24.5 2.1 28 0 55.3-8.3 78.5-23.9 3.3-2.3 7.5-3 11.4-2.1l44.9 10.1-11.2-49.7c-.8-3.4-.3-6.9 1.3-10 36-69 9.1-154.1-59.9-190.1-4.5-2.3-9.1-4.4-13.8-6.3-7.5-2.9-11.3-11.5-8.3-19 2.9-7.5 11.5-11.3 19-8.3 87.6 34.3 130.8 133 96.6 220.6-1.6 4-3.3 7.9-5.1 11.7l15.1 67.3c1.8 7.9-3.2 15.7-11.1 17.5-2.1.5-4.3.5-6.5 0l-61.5-13.8c-26.7 16.7-57.8 25.5-89.4 25.4zm-67.9-195.6h-18.6c-8.1 0-14.7-6.6-14.7-14.7s6.6-14.7 14.7-14.7h18.6c8.1 0 14.7 6.6 14.7 14.7-.1 8.2-6.7 14.7-14.7 14.7zm-79 0h-18.6c-8.1 0-14.7-6.6-14.7-14.7s6.6-14.7 14.7-14.7h18.6c8.1 0 14.7 6.6 14.7 14.7 0 8.2-6.6 14.7-14.7 14.7zm-79 0H97.3c-8.1 0-14.7-6.6-14.7-14.7S89.2 174 97.3 174h18.6c8.1 0 14.7 6.6 14.7 14.7 0 8.2-6.6 14.7-14.7 14.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">chat</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/chat.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/chat.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 454.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/chat-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M131.5 126.8h249V15.2H15.2v256.3h116.3z"></path><path class="lineal-stroke" d="M496.8 194.4c-8.4 0-15.2 6.8-15.2 15.2v158.3h-29.7c-8.4 0-15.2 6.8-15.2 15.2 0 .5 0 1.1.1 1.6l2.8 27.2-75.7-42.1c-2.3-1.3-4.8-1.9-7.4-1.9H146.7V142h233.8c8.4 0 15.2-6.8 15.2-15.2V15.2c0-8.4-6.8-15.2-15.2-15.2H15.2C6.8 0 0 6.8 0 15.2v256.3c0 8.4 6.8 15.2 15.2 15.2h101v96.4c0 8.4 6.8 15.2 15.2 15.2h221l97.8 54.3c7.3 4.1 16.6 1.4 20.7-5.9 1.5-2.7 2.2-5.9 1.8-9l-4.1-39.5h28.1c8.4 0 15.2-6.8 15.2-15.2V209.6c.1-8.4-6.7-15.2-15.1-15.2zM30.4 256.3V30.4h334.8v81.2H131.5c-8.4 0-15.2 6.8-15.2 15.2v129.5H30.4z"></path><path class="lineal-stroke" d="M413.8 223.6H214.4c-8.4 0-15.2-6.8-15.2-15.2s6.8-15.2 15.2-15.2h199.4c8.4 0 15.2 6.8 15.2 15.2s-6.8 15.2-15.2 15.2zm0 85.9H214.4c-8.4 0-15.2-6.8-15.2-15.2S206 279 214.4 279h199.4c8.4 0 15.2 6.8 15.2 15.2s-6.8 15.3-15.2 15.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 454.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/chat-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M131.5 126.8h249V15.2H15.2v256.3h116.3z"></path><path class="lineal-stroke" d="M496.8 194.4c-8.4 0-15.2 6.8-15.2 15.2v158.3h-29.7c-8.4 0-15.2 6.8-15.2 15.2 0 .5 0 1.1.1 1.6l2.8 27.2-75.7-42.1c-2.3-1.3-4.8-1.9-7.4-1.9H146.7V142h233.8c8.4 0 15.2-6.8 15.2-15.2V15.2c0-8.4-6.8-15.2-15.2-15.2H15.2C6.8 0 0 6.8 0 15.2v256.3c0 8.4 6.8 15.2 15.2 15.2h101v96.4c0 8.4 6.8 15.2 15.2 15.2h221l97.8 54.3c7.3 4.1 16.6 1.4 20.7-5.9 1.5-2.7 2.2-5.9 1.8-9l-4.1-39.5h28.1c8.4 0 15.2-6.8 15.2-15.2V209.6c.1-8.4-6.7-15.2-15.1-15.2zM30.4 256.3V30.4h334.8v81.2H131.5c-8.4 0-15.2 6.8-15.2 15.2v129.5H30.4z"></path><path class="lineal-stroke" d="M413.8 223.6H214.4c-8.4 0-15.2-6.8-15.2-15.2s6.8-15.2 15.2-15.2h199.4c8.4 0 15.2 6.8 15.2 15.2s-6.8 15.2-15.2 15.2zm0 85.9H214.4c-8.4 0-15.2-6.8-15.2-15.2S206 279 214.4 279h199.4c8.4 0 15.2 6.8 15.2 15.2s-6.8 15.3-15.2 15.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">chat-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/chat-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/chat-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">check</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/check.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/check.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 381.92" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M228.38 200.24L98.31 70.16l-41.69 41.69-41.69 41.69L145 283.62l83.38-83.38z"></path><path class="lineal-stroke" d="M507.63 87.75L424.25 4.37a14.93 14.93 0 00-21.11 0L228.38 179.13 108.86 59.6a14.93 14.93 0 00-21.11 0L4.37 143c-.35.36-.68.72-1 1.11s-.46.6-.67.91c-.07.09-.14.17-.2.26-.25.38-.47.76-.68 1.14l-.07.11c-.21.4-.39.79-.56 1.2l-.06.12c-.16.39-.29.78-.42 1.17 0 .07 0 .14-.07.21-.11.37-.2.74-.28 1.11 0 .1 0 .21-.07.31-.07.35-.12.7-.16 1.06 0 .13 0 .26-.06.39 0 .45-.06.9-.07 1.35v.21c0 .45 0 .9.07 1.35l.06.4c0 .35.09.7.16 1.05 0 .11.05.21.07.31.08.38.17.75.28 1.11 0 .07 0 .13.07.2.13.4.26.79.42 1.18l.06.12a13.17 13.17 0 00.57 1.2.22.22 0 00.05.08q.31.6.69 1.17l.15.2c.23.33.47.66.73 1s.43.48.65.72.22.26.34.38l213.46 213.42a14.93 14.93 0 0021.11-21.11l-72.82-72.82 72.82-72.83L413.69 36 476 98.31 301.21 273.06a14.93 14.93 0 0021.11 21.11l185.31-185.31a14.93 14.93 0 000-21.11zM98.31 91.27l109 109L145 262.51l-109-109z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 381.92" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M228.38 200.24L98.31 70.16l-41.69 41.69-41.69 41.69L145 283.62l83.38-83.38z"></path><path class="lineal-stroke" d="M507.63 87.75L424.25 4.37a14.93 14.93 0 00-21.11 0L228.38 179.13 108.86 59.6a14.93 14.93 0 00-21.11 0L4.37 143c-.35.36-.68.72-1 1.11s-.46.6-.67.91c-.07.09-.14.17-.2.26-.25.38-.47.76-.68 1.14l-.07.11c-.21.4-.39.79-.56 1.2l-.06.12c-.16.39-.29.78-.42 1.17 0 .07 0 .14-.07.21-.11.37-.2.74-.28 1.11 0 .1 0 .21-.07.31-.07.35-.12.7-.16 1.06 0 .13 0 .26-.06.39 0 .45-.06.9-.07 1.35v.21c0 .45 0 .9.07 1.35l.06.4c0 .35.09.7.16 1.05 0 .11.05.21.07.31.08.38.17.75.28 1.11 0 .07 0 .13.07.2.13.4.26.79.42 1.18l.06.12a13.17 13.17 0 00.57 1.2.22.22 0 00.05.08q.31.6.69 1.17l.15.2c.23.33.47.66.73 1s.43.48.65.72.22.26.34.38l213.46 213.42a14.93 14.93 0 0021.11-21.11l-72.82-72.82 72.82-72.83L413.69 36 476 98.31 301.21 273.06a14.93 14.93 0 0021.11 21.11l185.31-185.31a14.93 14.93 0 000-21.11zM98.31 91.27l109 109L145 262.51l-109-109z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">check-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/check-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/check-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 418.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check-list.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M14.8 97.6h85.4V14.8z"></path><path class="lineal-stroke" d="M100.2 112.4H14.8C6.6 112.4 0 105.8 0 97.7c0-4 1.6-7.9 4.5-10.7L89.9 4.2c5.8-5.7 15.2-5.6 20.9.3 2.7 2.8 4.2 6.5 4.2 10.3v82.8c0 8.2-6.6 14.8-14.8 14.8zm-49-29.6h34.2V49.7L51.2 82.8zM403.4 320c-8.2 0-14.8-6.6-14.8-14.8v-269c0-3.6-3.2-6.6-7.2-6.6H168.7c-8.2 0-14.8-6.6-14.8-14.8 0-8.2 6.6-14.8 14.8-14.8h212.6c20.3 0 36.8 16.2 36.8 36.1v269c.1 8.3-6.5 14.9-14.7 14.9z"></path><path class="lineal-stroke" d="M381.4 512H36.8C16.5 512 0 495.8 0 475.9V97.6c0-4 1.6-7.8 4.5-10.6L89.9 4.2c5.9-5.7 15.2-5.5 20.9.3 5.7 5.9 5.5 15.2-.3 20.9l-80.9 78.5v372c0 3.6 3.2 6.6 7.2 6.6h344.6c4 0 7.2-3 7.2-6.6v-92.7c.2-8.2 7-14.6 15.2-14.4 7.9.2 14.2 6.5 14.4 14.4v92.7c0 19.9-16.5 36.1-36.8 36.1z"></path><path class="lineal-stroke" d="M403.4 112.4H168.7c-8.2-.2-14.6-7-14.4-15.2.2-7.9 6.5-14.2 14.4-14.4h219.9v-43c0-5.7-4.6-10.3-10.3-10.3H168.7c-8.2 0-14.8-6.6-14.8-14.8C154 6.6 160.6 0 168.7 0h209.6c22 0 39.8 17.9 39.9 39.8v57.8c0 8.2-6.6 14.8-14.8 14.8z"></path><path class="lineal-fill" d="M73 189.6h124.1v65H73z"></path><path class="lineal-stroke" d="M197.1 269.4H73c-8.2 0-14.8-6.6-14.8-14.8v-65c0-8.2 6.6-14.8 14.7-14.8H197c8.2 0 14.8 6.6 14.8 14.8v65c.1 8.1-6.5 14.8-14.7 14.8.1 0 0 0 0 0zM87.8 239.8h94.6v-35.5H87.8v35.5zm201 25.3c-3.9 0-7.7-1.6-10.5-4.3l-23.6-23.6c-5.7-5.9-5.6-15.2.3-20.9 5.7-5.6 14.9-5.6 20.6 0l13.2 13.2 46-46c5.9-5.7 15.2-5.6 20.9.3 5.6 5.7 5.6 14.9 0 20.6l-56.4 56.4c-2.8 2.7-6.6 4.3-10.5 4.3z"></path><path class="lineal-fill" d="M73 346.1h124.1v65H73z"></path><path class="lineal-stroke" d="M197.1 426H73c-8.2 0-14.8-6.6-14.8-14.8v-65c0-8.2 6.5-14.8 14.7-14.9h124.2c8.2 0 14.8 6.6 14.8 14.8v65c0 8.2-6.5 14.9-14.8 14.9.1 0 .1 0 0 0zM87.8 396.4h94.6v-35.5H87.8v35.5zm201 25.3c-3.9 0-7.7-1.6-10.5-4.3l-23.6-23.6c-5.7-5.9-5.6-15.2.3-20.9 5.7-5.6 14.9-5.6 20.6 0l13.2 13.2 46-46c5.9-5.7 15.2-5.6 20.9.3 5.6 5.7 5.6 14.9 0 20.6l-56.4 56.4c-2.8 2.7-6.6 4.3-10.5 4.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 418.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check-list.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M14.8 97.6h85.4V14.8z"></path><path class="lineal-stroke" d="M100.2 112.4H14.8C6.6 112.4 0 105.8 0 97.7c0-4 1.6-7.9 4.5-10.7L89.9 4.2c5.8-5.7 15.2-5.6 20.9.3 2.7 2.8 4.2 6.5 4.2 10.3v82.8c0 8.2-6.6 14.8-14.8 14.8zm-49-29.6h34.2V49.7L51.2 82.8zM403.4 320c-8.2 0-14.8-6.6-14.8-14.8v-269c0-3.6-3.2-6.6-7.2-6.6H168.7c-8.2 0-14.8-6.6-14.8-14.8 0-8.2 6.6-14.8 14.8-14.8h212.6c20.3 0 36.8 16.2 36.8 36.1v269c.1 8.3-6.5 14.9-14.7 14.9z"></path><path class="lineal-stroke" d="M381.4 512H36.8C16.5 512 0 495.8 0 475.9V97.6c0-4 1.6-7.8 4.5-10.6L89.9 4.2c5.9-5.7 15.2-5.5 20.9.3 5.7 5.9 5.5 15.2-.3 20.9l-80.9 78.5v372c0 3.6 3.2 6.6 7.2 6.6h344.6c4 0 7.2-3 7.2-6.6v-92.7c.2-8.2 7-14.6 15.2-14.4 7.9.2 14.2 6.5 14.4 14.4v92.7c0 19.9-16.5 36.1-36.8 36.1z"></path><path class="lineal-stroke" d="M403.4 112.4H168.7c-8.2-.2-14.6-7-14.4-15.2.2-7.9 6.5-14.2 14.4-14.4h219.9v-43c0-5.7-4.6-10.3-10.3-10.3H168.7c-8.2 0-14.8-6.6-14.8-14.8C154 6.6 160.6 0 168.7 0h209.6c22 0 39.8 17.9 39.9 39.8v57.8c0 8.2-6.6 14.8-14.8 14.8z"></path><path class="lineal-fill" d="M73 189.6h124.1v65H73z"></path><path class="lineal-stroke" d="M197.1 269.4H73c-8.2 0-14.8-6.6-14.8-14.8v-65c0-8.2 6.6-14.8 14.7-14.8H197c8.2 0 14.8 6.6 14.8 14.8v65c.1 8.1-6.5 14.8-14.7 14.8.1 0 0 0 0 0zM87.8 239.8h94.6v-35.5H87.8v35.5zm201 25.3c-3.9 0-7.7-1.6-10.5-4.3l-23.6-23.6c-5.7-5.9-5.6-15.2.3-20.9 5.7-5.6 14.9-5.6 20.6 0l13.2 13.2 46-46c5.9-5.7 15.2-5.6 20.9.3 5.6 5.7 5.6 14.9 0 20.6l-56.4 56.4c-2.8 2.7-6.6 4.3-10.5 4.3z"></path><path class="lineal-fill" d="M73 346.1h124.1v65H73z"></path><path class="lineal-stroke" d="M197.1 426H73c-8.2 0-14.8-6.6-14.8-14.8v-65c0-8.2 6.5-14.8 14.7-14.9h124.2c8.2 0 14.8 6.6 14.8 14.8v65c0 8.2-6.5 14.9-14.8 14.9.1 0 .1 0 0 0zM87.8 396.4h94.6v-35.5H87.8v35.5zm201 25.3c-3.9 0-7.7-1.6-10.5-4.3l-23.6-23.6c-5.7-5.9-5.6-15.2.3-20.9 5.7-5.6 14.9-5.6 20.6 0l13.2 13.2 46-46c5.9-5.7 15.2-5.6 20.9.3 5.6 5.7 5.6 14.9 0 20.6l-56.4 56.4c-2.8 2.7-6.6 4.3-10.5 4.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">check-list</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/check-list.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/check-list.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 302.1 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clipboard.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M255 409.6H47c-25.9 0-47-21.1-47-47V118c.1-25.9 21.1-46.9 47-47h208c25.9.1 46.9 21.1 47 47v244.6c0 25.9-21.1 46.9-47 47zM47 92.8c-13.9 0-25.2 11.3-25.2 25.2v244.6c0 13.9 11.3 25.2 25.2 25.2h208c13.9 0 25.2-11.3 25.2-25.2V118c0-13.9-11.3-25.2-25.2-25.2H47z"></path><path class="lineal-fill" d="M206 49.4h-15.7c-.5-21.7-18.5-38.9-40.2-38.4-21 .5-37.9 17.4-38.4 38.4H96.1c-18 .3-32.3 15.1-32 33.1.3 17.5 14.4 31.6 32 32H206c17.9-.8 31.9-15.9 31.1-33.9-.7-17-14.2-30.5-31.1-31.2z"></path><path class="lineal-stroke" d="M206 125.3H96.1c-24 0-43.4-19.4-43.4-43.4s19.4-43.4 43.4-43.4h6.1c6.5-26.9 33.5-43.5 60.5-37.1 18.4 4.4 32.7 18.7 37.1 37.1h6.2c24 0 43.4 19.4 43.4 43.4S230 125.3 206 125.3zm-109.8-65c-11.9 0-21.6 9.7-21.6 21.6 0 11.9 9.7 21.6 21.6 21.6H206c11.9 0 21.6-9.7 21.6-21.6 0-11.9-9.7-21.6-21.6-21.6h-15.7c-5.9 0-10.8-4.7-10.9-10.7-.3-15.7-13.2-28.1-28.9-27.8-15.3.3-27.5 12.6-27.8 27.8-.1 5.9-5 10.7-10.9 10.7H96.2zm124.2 130.2H81.7c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h138.7c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2h-.6zm0 69.4H81.7c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h138.7c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2h-.6zm0 69.3H81.7c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h138.7c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2h-.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 302.1 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clipboard.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M255 409.6H47c-25.9 0-47-21.1-47-47V118c.1-25.9 21.1-46.9 47-47h208c25.9.1 46.9 21.1 47 47v244.6c0 25.9-21.1 46.9-47 47zM47 92.8c-13.9 0-25.2 11.3-25.2 25.2v244.6c0 13.9 11.3 25.2 25.2 25.2h208c13.9 0 25.2-11.3 25.2-25.2V118c0-13.9-11.3-25.2-25.2-25.2H47z"></path><path class="lineal-fill" d="M206 49.4h-15.7c-.5-21.7-18.5-38.9-40.2-38.4-21 .5-37.9 17.4-38.4 38.4H96.1c-18 .3-32.3 15.1-32 33.1.3 17.5 14.4 31.6 32 32H206c17.9-.8 31.9-15.9 31.1-33.9-.7-17-14.2-30.5-31.1-31.2z"></path><path class="lineal-stroke" d="M206 125.3H96.1c-24 0-43.4-19.4-43.4-43.4s19.4-43.4 43.4-43.4h6.1c6.5-26.9 33.5-43.5 60.5-37.1 18.4 4.4 32.7 18.7 37.1 37.1h6.2c24 0 43.4 19.4 43.4 43.4S230 125.3 206 125.3zm-109.8-65c-11.9 0-21.6 9.7-21.6 21.6 0 11.9 9.7 21.6 21.6 21.6H206c11.9 0 21.6-9.7 21.6-21.6 0-11.9-9.7-21.6-21.6-21.6h-15.7c-5.9 0-10.8-4.7-10.9-10.7-.3-15.7-13.2-28.1-28.9-27.8-15.3.3-27.5 12.6-27.8 27.8-.1 5.9-5 10.7-10.9 10.7H96.2zm124.2 130.2H81.7c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h138.7c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2h-.6zm0 69.4H81.7c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h138.7c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2h-.6zm0 69.3H81.7c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h138.7c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2h-.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">clipboard</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clipboard.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clipboard.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 437.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clock.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="256" cy="232" r="123.5"></circle><path class="lineal-stroke" d="M256 369.1c-75.6 0-137.1-61.5-137.1-137.1S180.4 95 256 95s137.1 61.5 137.1 137.1-61.5 137-137.1 137zm0-247c-60.7 0-109.9 49.2-109.9 109.9S195.3 341.9 256 341.9 365.9 292.7 365.9 232c-.1-60.6-49.2-109.8-109.9-109.9z"></path><path class="lineal-stroke" d="M316.3 245.6H256c-7.5 0-13.6-6.1-13.6-13.6v-61.2c0-7.5 6.1-13.6 13.6-13.6s13.6 6.1 13.6 13.6v47.6h46.7c7.5 0 13.6 6.1 13.6 13.6 0 7.6-6.1 13.6-13.6 13.6z"></path><path class="lineal-stroke" d="M493.1 21.6c-26.3-27.7-70-28.9-97.7-2.7L384 29.4c-5.5 5.1-5.9 13.7-.8 19.2l.1.1 28.9 30.5-9.7 9.2c-79.2-80.9-208.9-82.2-289.8-3l-3.1 3.1-9.8-9.3 28.8-30.5c5.2-5.4 4.9-14-.5-19.2l-.1-.1-11.4-10.5C88.9-7.4 45.1-6.2 18.9 21.6s-25.1 71.5 2.7 97.8l.1.1 11.5 10.6c5.5 5 14 4.8 19.1-.6L81.1 99l10.7 10.2C36.4 183.1 37.3 285.1 94.1 358l-20.6 19.5c-5.4 5.2-5.7 13.8-.5 19.2 5.2 5.4 13.8 5.7 19.2.5l20-19c79.7 78.6 207.8 78.6 287.5 0l20 19c5.4 5.2 14.1 4.9 19.2-.5 5.2-5.4 4.9-14.1-.5-19.2l-20.6-19.6c28.1-35.9 43.3-80.3 43.3-125.9 0-7.5-6.1-13.6-13.6-13.6s-13.6 6.1-13.6 13.6c0 98.1-79.8 178-178 178s-178-79.8-178-178 79.8-178 178-178c52.1 0 101.6 22.8 135.4 62.5.1.1.2.3.4.4s.1.2.2.2.1.1.2.2l.5.4c.2.2.5.4.7.6l.1.1c5.3 4.2 12.8 3.8 17.7-.8L430.9 99l28.9 30.5c5.1 5.4 13.6 5.7 19.1.6l11.5-10.6.1-.1c27.6-26.3 28.8-70.1 2.6-97.8zM41.7 101l-1.5-1.4c-16.3-16.5-16.2-43.1.2-59.4 15.8-15.6 41-16.3 57.6-1.5l.1.1 1.4 1.2-57.8 61zm430.1-1.4l-1.5 1.4-57.8-60.9 1.4-1.2.1-.1c17.3-15.5 43.8-14.1 59.3 3.2 14.9 16.4 14.2 41.8-1.5 57.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 437.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clock.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="256" cy="232" r="123.5"></circle><path class="lineal-stroke" d="M256 369.1c-75.6 0-137.1-61.5-137.1-137.1S180.4 95 256 95s137.1 61.5 137.1 137.1-61.5 137-137.1 137zm0-247c-60.7 0-109.9 49.2-109.9 109.9S195.3 341.9 256 341.9 365.9 292.7 365.9 232c-.1-60.6-49.2-109.8-109.9-109.9z"></path><path class="lineal-stroke" d="M316.3 245.6H256c-7.5 0-13.6-6.1-13.6-13.6v-61.2c0-7.5 6.1-13.6 13.6-13.6s13.6 6.1 13.6 13.6v47.6h46.7c7.5 0 13.6 6.1 13.6 13.6 0 7.6-6.1 13.6-13.6 13.6z"></path><path class="lineal-stroke" d="M493.1 21.6c-26.3-27.7-70-28.9-97.7-2.7L384 29.4c-5.5 5.1-5.9 13.7-.8 19.2l.1.1 28.9 30.5-9.7 9.2c-79.2-80.9-208.9-82.2-289.8-3l-3.1 3.1-9.8-9.3 28.8-30.5c5.2-5.4 4.9-14-.5-19.2l-.1-.1-11.4-10.5C88.9-7.4 45.1-6.2 18.9 21.6s-25.1 71.5 2.7 97.8l.1.1 11.5 10.6c5.5 5 14 4.8 19.1-.6L81.1 99l10.7 10.2C36.4 183.1 37.3 285.1 94.1 358l-20.6 19.5c-5.4 5.2-5.7 13.8-.5 19.2 5.2 5.4 13.8 5.7 19.2.5l20-19c79.7 78.6 207.8 78.6 287.5 0l20 19c5.4 5.2 14.1 4.9 19.2-.5 5.2-5.4 4.9-14.1-.5-19.2l-20.6-19.6c28.1-35.9 43.3-80.3 43.3-125.9 0-7.5-6.1-13.6-13.6-13.6s-13.6 6.1-13.6 13.6c0 98.1-79.8 178-178 178s-178-79.8-178-178 79.8-178 178-178c52.1 0 101.6 22.8 135.4 62.5.1.1.2.3.4.4s.1.2.2.2.1.1.2.2l.5.4c.2.2.5.4.7.6l.1.1c5.3 4.2 12.8 3.8 17.7-.8L430.9 99l28.9 30.5c5.1 5.4 13.6 5.7 19.1.6l11.5-10.6.1-.1c27.6-26.3 28.8-70.1 2.6-97.8zM41.7 101l-1.5-1.4c-16.3-16.5-16.2-43.1.2-59.4 15.8-15.6 41-16.3 57.6-1.5l.1.1 1.4 1.2-57.8 61zm430.1-1.4l-1.5 1.4-57.8-60.9 1.4-1.2.1-.1c17.3-15.5 43.8-14.1 59.3 3.2 14.9 16.4 14.2 41.8-1.5 57.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">clock</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clock.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clock.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 463.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clock-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="231.6" cy="280.4" r="150.7"></circle><path class="lineal-stroke" d="M193 227c16.9 0 34 10.7 34 30.2 0 31.7-45.1 42-45.1 55.3v1.3h38.2c3.6 0 6.9 4.5 6.9 9.8s-3.2 10.1-6.9 10.1h-52c-4.1 0-9.9-2.8-9.9-7v-14.1c0-22.9 46-36.1 46-54.6 0-4.7-2.9-10.4-11.1-10.4-5.8 0-10.9 2.9-10.9 10.9 0 4.2-4.5 8.3-12 8.3-5.8 0-10.2-2.6-10.2-11.8 0-17.8 16.4-28 33-28zm75.9 84.3h-34.2c-4.2 0-7.6-2.8-7.6-7.9 0-1.5.4-3 1.2-4.4l33.7-66.1c1.7-3.6 5.5-5.9 9.5-5.8 3.9 0 11.4 3.4 11.4 8.6-.1 1-.3 1.9-.7 2.8l-25.8 51.8h12.5V280c0-4.8 5.7-6.9 11.4-6.9s11.4 2 11.4 6.9v10.2h6.3c4.7 0 7 5.3 7 10.5s-3.5 10.5-7 10.5h-6.3v15.5c0 4.7-5.7 7-11.4 7s-11.4-2.3-11.4-7v-15.4z"></path><path class="lineal-stroke" d="M448.6 265.8c-8.1 0-14.6 6.5-14.6 14.6 0 111.6-90.8 202.4-202.4 202.4S29.2 392 29.2 280.4 120 78 231.6 78c44.2 0 87.2 14.5 122.4 41.2l-26.5 26.5c-28-20-61.5-30.8-95.9-30.7-91.2 0-165.3 74.2-165.3 165.3s74.2 165.3 165.3 165.3S397 371.6 397 280.4c0-35.9-11.7-70.9-33.4-99.5l80 21.4c1.2.3 2.5.5 3.8.5h.2c8.1-.1 14.5-6.7 14.5-14.7 0-1.6-.3-3.1-.8-4.6L431.6 72.7c-2.1-7.8-10.1-12.4-17.9-10.3-2.5.7-4.7 2-6.5 3.8l-32.3 32.3C338 69.3 293.1 52.2 246.2 49.2v-20h17.7c8.1-.2 14.4-6.9 14.2-15-.2-7.8-6.5-14-14.2-14.2h-64.6c-8.1.2-14.4 6.9-14.2 15 .2 7.8 6.5 14 14.2 14.2H217v20C96.1 56.8 0 157.6 0 280.4 0 408.1 103.9 512 231.6 512s231.6-103.9 231.6-231.6c0-8.1-6.5-14.6-14.6-14.6zm-217 150.7c-75.1 0-136.1-61.1-136.1-136.1s61.1-136.1 136.1-136.1 136.1 61.1 136.1 136.1-61 136.1-136.1 136.1zm178.3-311.8l16.9 62.9-62.9-16.9 46-46z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 463.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clock-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="231.6" cy="280.4" r="150.7"></circle><path class="lineal-stroke" d="M193 227c16.9 0 34 10.7 34 30.2 0 31.7-45.1 42-45.1 55.3v1.3h38.2c3.6 0 6.9 4.5 6.9 9.8s-3.2 10.1-6.9 10.1h-52c-4.1 0-9.9-2.8-9.9-7v-14.1c0-22.9 46-36.1 46-54.6 0-4.7-2.9-10.4-11.1-10.4-5.8 0-10.9 2.9-10.9 10.9 0 4.2-4.5 8.3-12 8.3-5.8 0-10.2-2.6-10.2-11.8 0-17.8 16.4-28 33-28zm75.9 84.3h-34.2c-4.2 0-7.6-2.8-7.6-7.9 0-1.5.4-3 1.2-4.4l33.7-66.1c1.7-3.6 5.5-5.9 9.5-5.8 3.9 0 11.4 3.4 11.4 8.6-.1 1-.3 1.9-.7 2.8l-25.8 51.8h12.5V280c0-4.8 5.7-6.9 11.4-6.9s11.4 2 11.4 6.9v10.2h6.3c4.7 0 7 5.3 7 10.5s-3.5 10.5-7 10.5h-6.3v15.5c0 4.7-5.7 7-11.4 7s-11.4-2.3-11.4-7v-15.4z"></path><path class="lineal-stroke" d="M448.6 265.8c-8.1 0-14.6 6.5-14.6 14.6 0 111.6-90.8 202.4-202.4 202.4S29.2 392 29.2 280.4 120 78 231.6 78c44.2 0 87.2 14.5 122.4 41.2l-26.5 26.5c-28-20-61.5-30.8-95.9-30.7-91.2 0-165.3 74.2-165.3 165.3s74.2 165.3 165.3 165.3S397 371.6 397 280.4c0-35.9-11.7-70.9-33.4-99.5l80 21.4c1.2.3 2.5.5 3.8.5h.2c8.1-.1 14.5-6.7 14.5-14.7 0-1.6-.3-3.1-.8-4.6L431.6 72.7c-2.1-7.8-10.1-12.4-17.9-10.3-2.5.7-4.7 2-6.5 3.8l-32.3 32.3C338 69.3 293.1 52.2 246.2 49.2v-20h17.7c8.1-.2 14.4-6.9 14.2-15-.2-7.8-6.5-14-14.2-14.2h-64.6c-8.1.2-14.4 6.9-14.2 15 .2 7.8 6.5 14 14.2 14.2H217v20C96.1 56.8 0 157.6 0 280.4 0 408.1 103.9 512 231.6 512s231.6-103.9 231.6-231.6c0-8.1-6.5-14.6-14.6-14.6zm-217 150.7c-75.1 0-136.1-61.1-136.1-136.1s61.1-136.1 136.1-136.1 136.1 61.1 136.1 136.1-61 136.1-136.1 136.1zm178.3-311.8l16.9 62.9-62.9-16.9 46-46z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">clock-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clock-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clock-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 391.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clock-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M148.9 61.3C136 24.4 95.7 4.9 58.8 17.8S2.4 71.1 15.3 108c6.5 18.5 20.3 33.5 38.3 41.4 15.9-42.8 51.3-75.5 95.3-88.1z"></path><path class="lineal-stroke" d="M53.5 160.7c-1.6 0-3.1-.4-4.6-1C7.5 141.4-11.3 93 7 51.5s66.8-60.3 108.2-42c20.8 9.2 36.9 26.6 44.4 48.1 2.1 5.9-1 12.3-6.9 14.4-.2.1-.4.1-.6.2-40.5 11.6-73.1 41.7-87.9 81.1-1.8 4.5-6 7.4-10.7 7.4zM82.1 25.2c-32.8 0-59.5 26.6-59.5 59.5 0 19.4 9.5 37.7 25.4 48.8C65.2 97.2 95.8 69 133.4 54.7c-10.7-18.3-30.2-29.5-51.3-29.5z"></path><path class="lineal-fill" d="M327.5 13.9c-30.1 0-56.9 19-66.8 47.5 44 12.6 79.4 45.2 95.4 88.1 35.8-15.8 52-57.6 36.2-93.3-11.3-25.8-36.7-42.3-64.8-42.3z"></path><path class="lineal-stroke" d="M356.1 160.7c-4.7 0-8.9-2.9-10.6-7.4-14.8-39.5-47.4-69.6-87.9-81.2-6-1.7-9.5-8-7.8-14 .1-.2.1-.4.2-.6C264.9 14.7 311.7-7.9 354.5 7S420 68.8 405 111.7c-7.5 21.5-23.6 38.9-44.4 48.1-1.4.6-2.9.9-4.5.9zM276.2 54.6c37.6 14.3 68.1 42.5 85.4 78.8 26.9-18.8 33.5-55.9 14.7-82.8s-55.9-33.5-82.8-14.7c-7.1 4.9-13 11.3-17.3 18.7zm-79.4 176c-3.1 0-6.1-.7-8.8-2.1l-45.1-22.6c-5.6-2.8-7.8-9.6-5-15.2s9.6-7.8 15.2-5l43.3 21.6 57.4-57.4c4.4-4.4 11.6-4.4 16 0s4.4 11.6 0 16l-58.9 58.9c-3.8 3.7-8.8 5.8-14.1 5.8z"></path><path class="lineal-stroke" d="M204.8 391.2c-96.8 0-175.6-78.8-175.6-175.6S108 39.9 204.8 39.9c69.8 0 133 41.3 161 105.2 2.5 5.7-.1 12.4-5.9 14.9s-12.4-.1-14.9-5.9c-24.4-55.7-79.4-91.7-140.2-91.7-84.4 0-153 68.6-153 153s68.6 153 153 153 153-68.6 153-153c-.2-6.2 4.7-11.5 11-11.6 6.2-.2 11.5 4.7 11.6 11v.7c0 96.9-78.8 175.7-175.6 175.7z"></path><path class="lineal-stroke" d="M287.1 281.5c-1.9 0-3.7-.5-5.4-1.4l-102.4-55.7c-5.5-3-7.5-9.8-4.5-15.3s9.8-7.5 15.3-4.5l102.5 55.7c5.5 3 7.5 9.8 4.5 15.3-2 3.6-5.8 5.9-10 5.9zm-82.3-178.4c-6.2 0-11.3-5-11.3-11.3V51.2c0-6.2 5.1-11.3 11.3-11.3s11.3 5.1 11.3 11.3v40.5c0 6.3-5 11.3-11.3 11.4zm0 288.1c-6.2 0-11.3-5.1-11.3-11.3v-40.5c0-6.2 5.1-11.3 11.3-11.3s11.3 5.1 11.3 11.3v40.5c0 6.2-5 11.3-11.3 11.3zm164.3-164.3h-40.5c-6.2.2-11.5-4.7-11.6-11-.2-6.2 4.7-11.5 11-11.6h41.2c6.2.2 11.2 5.4 11 11.6-.3 6-5.1 10.8-11.1 11zm-288.1 0H40.5c-6.2-.2-11.2-5.4-11-11.6.2-6 5-10.8 11-11H81c6.2.2 11.2 5.4 11 11.6-.2 6-5 10.8-11 11z"></path><path class="lineal-stroke" d="M241.2 62.5c-6.2 0-11.3-5.1-11.3-11.3V27.9c0-2.9-2.4-5.3-5.3-5.3H185c-2.9 0-5.3 2.4-5.3 5.3v23.4c0 6.2-5.1 11.3-11.3 11.3s-11.3-5.1-11.3-11.3V27.9C157.1 12.5 169.6 0 185 0h39.6c15.4 0 27.9 12.5 27.9 27.9v23.4c-.1 6.2-5.1 11.2-11.3 11.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 391.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/clock-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M148.9 61.3C136 24.4 95.7 4.9 58.8 17.8S2.4 71.1 15.3 108c6.5 18.5 20.3 33.5 38.3 41.4 15.9-42.8 51.3-75.5 95.3-88.1z"></path><path class="lineal-stroke" d="M53.5 160.7c-1.6 0-3.1-.4-4.6-1C7.5 141.4-11.3 93 7 51.5s66.8-60.3 108.2-42c20.8 9.2 36.9 26.6 44.4 48.1 2.1 5.9-1 12.3-6.9 14.4-.2.1-.4.1-.6.2-40.5 11.6-73.1 41.7-87.9 81.1-1.8 4.5-6 7.4-10.7 7.4zM82.1 25.2c-32.8 0-59.5 26.6-59.5 59.5 0 19.4 9.5 37.7 25.4 48.8C65.2 97.2 95.8 69 133.4 54.7c-10.7-18.3-30.2-29.5-51.3-29.5z"></path><path class="lineal-fill" d="M327.5 13.9c-30.1 0-56.9 19-66.8 47.5 44 12.6 79.4 45.2 95.4 88.1 35.8-15.8 52-57.6 36.2-93.3-11.3-25.8-36.7-42.3-64.8-42.3z"></path><path class="lineal-stroke" d="M356.1 160.7c-4.7 0-8.9-2.9-10.6-7.4-14.8-39.5-47.4-69.6-87.9-81.2-6-1.7-9.5-8-7.8-14 .1-.2.1-.4.2-.6C264.9 14.7 311.7-7.9 354.5 7S420 68.8 405 111.7c-7.5 21.5-23.6 38.9-44.4 48.1-1.4.6-2.9.9-4.5.9zM276.2 54.6c37.6 14.3 68.1 42.5 85.4 78.8 26.9-18.8 33.5-55.9 14.7-82.8s-55.9-33.5-82.8-14.7c-7.1 4.9-13 11.3-17.3 18.7zm-79.4 176c-3.1 0-6.1-.7-8.8-2.1l-45.1-22.6c-5.6-2.8-7.8-9.6-5-15.2s9.6-7.8 15.2-5l43.3 21.6 57.4-57.4c4.4-4.4 11.6-4.4 16 0s4.4 11.6 0 16l-58.9 58.9c-3.8 3.7-8.8 5.8-14.1 5.8z"></path><path class="lineal-stroke" d="M204.8 391.2c-96.8 0-175.6-78.8-175.6-175.6S108 39.9 204.8 39.9c69.8 0 133 41.3 161 105.2 2.5 5.7-.1 12.4-5.9 14.9s-12.4-.1-14.9-5.9c-24.4-55.7-79.4-91.7-140.2-91.7-84.4 0-153 68.6-153 153s68.6 153 153 153 153-68.6 153-153c-.2-6.2 4.7-11.5 11-11.6 6.2-.2 11.5 4.7 11.6 11v.7c0 96.9-78.8 175.7-175.6 175.7z"></path><path class="lineal-stroke" d="M287.1 281.5c-1.9 0-3.7-.5-5.4-1.4l-102.4-55.7c-5.5-3-7.5-9.8-4.5-15.3s9.8-7.5 15.3-4.5l102.5 55.7c5.5 3 7.5 9.8 4.5 15.3-2 3.6-5.8 5.9-10 5.9zm-82.3-178.4c-6.2 0-11.3-5-11.3-11.3V51.2c0-6.2 5.1-11.3 11.3-11.3s11.3 5.1 11.3 11.3v40.5c0 6.3-5 11.3-11.3 11.4zm0 288.1c-6.2 0-11.3-5.1-11.3-11.3v-40.5c0-6.2 5.1-11.3 11.3-11.3s11.3 5.1 11.3 11.3v40.5c0 6.2-5 11.3-11.3 11.3zm164.3-164.3h-40.5c-6.2.2-11.5-4.7-11.6-11-.2-6.2 4.7-11.5 11-11.6h41.2c6.2.2 11.2 5.4 11 11.6-.3 6-5.1 10.8-11.1 11zm-288.1 0H40.5c-6.2-.2-11.2-5.4-11-11.6.2-6 5-10.8 11-11H81c6.2.2 11.2 5.4 11 11.6-.2 6-5 10.8-11 11z"></path><path class="lineal-stroke" d="M241.2 62.5c-6.2 0-11.3-5.1-11.3-11.3V27.9c0-2.9-2.4-5.3-5.3-5.3H185c-2.9 0-5.3 2.4-5.3 5.3v23.4c0 6.2-5.1 11.3-11.3 11.3s-11.3-5.1-11.3-11.3V27.9C157.1 12.5 169.6 0 185 0h39.6c15.4 0 27.9 12.5 27.9 27.9v23.4c-.1 6.2-5.1 11.2-11.3 11.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">clock-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clock-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/clock-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 319.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M333.9 278.3h-47c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h47c29.8 0 53.9-24.1 53.9-53.9 0-25.9-18.5-48.1-43.9-52.9-5.9-1.1-9.8-6.8-8.7-12.7 0-.2.1-.5.2-.7 12.7-48.9-16.6-98.8-65.5-111.4-38.4-10-78.9 6-100.2 39.5-2.9 4.6-8.8 6.3-13.7 4.1-30.1-13.6-65.6-.2-79.2 29.9-3.5 7.8-5.3 16.2-5.3 24.7 0 4.6.6 9.3 1.6 13.8 1.4 5.9-2.3 11.7-8.1 13.1h-.2c-29.3 6-47.9 34.5-41.8 63.7 5.2 24.9 27.2 42.8 52.7 42.8H123c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2H75.7C33.9 278.3 0 244.5 0 202.7c0-31.9 20-60.4 50-71.3-.3-2.8-.4-5.6-.5-8.5 0-45.1 36.6-81.7 81.7-81.7 8.5 0 17 1.3 25.1 3.9 37.6-50 108.6-60 158.5-22.4C348.4 48 365.2 89.6 358.6 131c39.5 13.6 60.5 56.7 46.9 96.2-10.6 30.6-39.3 51.1-71.6 51.1z"></path><path class="lineal-fill" d="M159 251.2l39.2 53.6c2.7 3.6 7.8 4.4 11.4 1.8.7-.5 1.3-1.1 1.8-1.8l39.3-53.6c2.7-3.6 1.9-8.7-1.7-11.4-1.4-1-3.1-1.6-4.9-1.6h-10.7V186c0-10.3-8.3-18.6-18.6-18.6H195c-10.3 0-18.6 8.4-18.6 18.6v52.2h-10.7c-4.5 0-8.2 3.6-8.2 8.1-.1 1.8.4 3.5 1.5 4.9z"></path><path class="lineal-stroke" d="M204.8 319.1c-6.1 0-11.8-2.9-15.4-7.8l-39.3-53.6c-6.2-8.5-4.4-20.4 4.1-26.7 3.2-2.3 7.1-3.6 11.1-3.7V186c0-16.3 13.2-29.5 29.5-29.6h19.8c16.3 0 29.5 13.2 29.6 29.6v41.3c10.5.1 19 8.8 18.8 19.3 0 4-1.3 7.8-3.7 11L220 311.2c-3.4 5-9.1 7.8-15.2 7.9zm-33.8-70l33.8 46.2 33.8-46.2h-5.3c-6 0-10.9-4.9-10.9-10.9V186c0-4.3-3.5-7.7-7.7-7.7h-19.9c-4.3 0-7.7 3.5-7.7 7.7v52.2c0 6-4.9 10.9-10.9 10.9H171z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 319.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M333.9 278.3h-47c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h47c29.8 0 53.9-24.1 53.9-53.9 0-25.9-18.5-48.1-43.9-52.9-5.9-1.1-9.8-6.8-8.7-12.7 0-.2.1-.5.2-.7 12.7-48.9-16.6-98.8-65.5-111.4-38.4-10-78.9 6-100.2 39.5-2.9 4.6-8.8 6.3-13.7 4.1-30.1-13.6-65.6-.2-79.2 29.9-3.5 7.8-5.3 16.2-5.3 24.7 0 4.6.6 9.3 1.6 13.8 1.4 5.9-2.3 11.7-8.1 13.1h-.2c-29.3 6-47.9 34.5-41.8 63.7 5.2 24.9 27.2 42.8 52.7 42.8H123c6-.2 11.1 4.6 11.2 10.6.2 6-4.6 11.1-10.6 11.2H75.7C33.9 278.3 0 244.5 0 202.7c0-31.9 20-60.4 50-71.3-.3-2.8-.4-5.6-.5-8.5 0-45.1 36.6-81.7 81.7-81.7 8.5 0 17 1.3 25.1 3.9 37.6-50 108.6-60 158.5-22.4C348.4 48 365.2 89.6 358.6 131c39.5 13.6 60.5 56.7 46.9 96.2-10.6 30.6-39.3 51.1-71.6 51.1z"></path><path class="lineal-fill" d="M159 251.2l39.2 53.6c2.7 3.6 7.8 4.4 11.4 1.8.7-.5 1.3-1.1 1.8-1.8l39.3-53.6c2.7-3.6 1.9-8.7-1.7-11.4-1.4-1-3.1-1.6-4.9-1.6h-10.7V186c0-10.3-8.3-18.6-18.6-18.6H195c-10.3 0-18.6 8.4-18.6 18.6v52.2h-10.7c-4.5 0-8.2 3.6-8.2 8.1-.1 1.8.4 3.5 1.5 4.9z"></path><path class="lineal-stroke" d="M204.8 319.1c-6.1 0-11.8-2.9-15.4-7.8l-39.3-53.6c-6.2-8.5-4.4-20.4 4.1-26.7 3.2-2.3 7.1-3.6 11.1-3.7V186c0-16.3 13.2-29.5 29.5-29.6h19.8c16.3 0 29.5 13.2 29.6 29.6v41.3c10.5.1 19 8.8 18.8 19.3 0 4-1.3 7.8-3.7 11L220 311.2c-3.4 5-9.1 7.8-15.2 7.9zm-33.8-70l33.8 46.2 33.8-46.2h-5.3c-6 0-10.9-4.9-10.9-10.9V186c0-4.3-3.5-7.7-7.7-7.7h-19.9c-4.3 0-7.7 3.5-7.7 7.7v52.2c0 6-4.9 10.9-10.9 10.9H171z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-computing</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cloud-computing.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cloud-computing.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 319.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M333.9 278.3H276c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h57.9c29.8 0 53.9-24.1 53.9-53.9 0-25.9-18.5-48.1-43.9-52.9-5.9-1.1-9.8-6.8-8.7-12.7 0-.2.1-.5.2-.7 12.6-48.9-16.8-98.7-65.7-111.4-38.3-9.9-78.7 6-100 39.4-2.9 4.6-8.8 6.3-13.7 4.1-30.1-13.6-65.6-.2-79.2 29.9-3.5 7.8-5.3 16.2-5.3 24.7 0 4.6.6 9.3 1.6 13.8 1.4 5.9-2.3 11.7-8.1 13.1-.1 0-.2 0-.2.1-29.3 6-47.9 34.6-41.8 63.7 5.3 24.9 27.2 42.8 52.7 42.8h58.2c6 .2 10.8 5.2 10.6 11.2-.2 5.8-4.8 10.4-10.6 10.6H75.7C33.9 278.3 0 244.4 0 202.6c0-31.9 20-60.4 50-71.2-.3-2.8-.4-5.7-.5-8.5 0-45.1 36.6-81.7 81.8-81.7 8.5 0 16.9 1.3 25 3.9 37.6-50 108.6-60 158.5-22.4C348.4 48 365.2 89.6 358.6 131c39.5 13.6 60.5 56.7 46.9 96.2-10.6 30.6-39.3 51.1-71.6 51.1z"></path><path class="lineal-fill" d="M250.6 224.3l-39.3-53.6c-2.7-3.6-7.8-4.4-11.4-1.8-.7.5-1.3 1.1-1.8 1.8L159 224.3c-2.7 3.6-1.9 8.7 1.7 11.4 1.4 1 3.1 1.6 4.9 1.6h10.7v52.2c0 10.3 8.3 18.6 18.6 18.6h19.8c10.3 0 18.6-8.3 18.6-18.6v-52.3H244c4.5 0 8.2-3.6 8.2-8.1.1-1.7-.5-3.4-1.6-4.8z"></path><path class="lineal-stroke" d="M214.7 319.1h-19.8c-16.3 0-29.5-13.2-29.5-29.5v-41.3c-10.5-.1-19-8.8-18.9-19.3 0-4 1.3-7.8 3.7-11l39.3-53.6c6.2-8.5 18-10.4 26.5-4.2 1.6 1.2 3 2.6 4.2 4.2l39.3 53.6c6.2 8.5 4.4 20.4-4.1 26.6-3.2 2.3-7.1 3.6-11 3.7v41.3c-.1 16.2-13.4 29.4-29.7 29.5zM171 226.4h5.3c6 0 10.9 4.9 10.9 10.9v52.2c0 4.3 3.5 7.7 7.7 7.7h19.8c4.3 0 7.7-3.5 7.7-7.7v-52.2c0-6 4.9-10.9 10.9-10.9h5.3l-33.9-46.2-33.7 46.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 319.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M333.9 278.3H276c-6-.2-10.8-5.2-10.6-11.2.2-5.8 4.8-10.4 10.6-10.6h57.9c29.8 0 53.9-24.1 53.9-53.9 0-25.9-18.5-48.1-43.9-52.9-5.9-1.1-9.8-6.8-8.7-12.7 0-.2.1-.5.2-.7 12.6-48.9-16.8-98.7-65.7-111.4-38.3-9.9-78.7 6-100 39.4-2.9 4.6-8.8 6.3-13.7 4.1-30.1-13.6-65.6-.2-79.2 29.9-3.5 7.8-5.3 16.2-5.3 24.7 0 4.6.6 9.3 1.6 13.8 1.4 5.9-2.3 11.7-8.1 13.1-.1 0-.2 0-.2.1-29.3 6-47.9 34.6-41.8 63.7 5.3 24.9 27.2 42.8 52.7 42.8h58.2c6 .2 10.8 5.2 10.6 11.2-.2 5.8-4.8 10.4-10.6 10.6H75.7C33.9 278.3 0 244.4 0 202.6c0-31.9 20-60.4 50-71.2-.3-2.8-.4-5.7-.5-8.5 0-45.1 36.6-81.7 81.8-81.7 8.5 0 16.9 1.3 25 3.9 37.6-50 108.6-60 158.5-22.4C348.4 48 365.2 89.6 358.6 131c39.5 13.6 60.5 56.7 46.9 96.2-10.6 30.6-39.3 51.1-71.6 51.1z"></path><path class="lineal-fill" d="M250.6 224.3l-39.3-53.6c-2.7-3.6-7.8-4.4-11.4-1.8-.7.5-1.3 1.1-1.8 1.8L159 224.3c-2.7 3.6-1.9 8.7 1.7 11.4 1.4 1 3.1 1.6 4.9 1.6h10.7v52.2c0 10.3 8.3 18.6 18.6 18.6h19.8c10.3 0 18.6-8.3 18.6-18.6v-52.3H244c4.5 0 8.2-3.6 8.2-8.1.1-1.7-.5-3.4-1.6-4.8z"></path><path class="lineal-stroke" d="M214.7 319.1h-19.8c-16.3 0-29.5-13.2-29.5-29.5v-41.3c-10.5-.1-19-8.8-18.9-19.3 0-4 1.3-7.8 3.7-11l39.3-53.6c6.2-8.5 18-10.4 26.5-4.2 1.6 1.2 3 2.6 4.2 4.2l39.3 53.6c6.2 8.5 4.4 20.4-4.1 26.6-3.2 2.3-7.1 3.6-11 3.7v41.3c-.1 16.2-13.4 29.4-29.7 29.5zM171 226.4h5.3c6 0 10.9 4.9 10.9 10.9v52.2c0 4.3 3.5 7.7 7.7 7.7h19.8c4.3 0 7.7-3.5 7.7-7.7v-52.2c0-6 4.9-10.9 10.9-10.9h5.3l-33.9-46.2-33.7 46.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-computing-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cloud-computing-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cloud-computing-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 361.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M309.9 231h-12.7c-6.1.2-11.3-4.6-11.5-10.8-.2-6.1 4.6-11.3 10.8-11.5h13.4c23 0 41.6-18.7 41.6-41.6 0-20-14.3-37.1-33.9-40.8-6-1.1-10-6.9-8.9-13 0-.3.1-.5.2-.7 10-38.6-13.2-78-51.8-88-5.9-1.5-11.9-2.3-18-2.3-24.7-.1-47.7 12.6-60.9 33.5-3 4.7-8.9 6.5-14 4.2-23.4-10.6-50.9-.2-61.5 23.2-2.7 6-4.1 12.5-4.1 19.1 0 3.6.4 7.2 1.3 10.7 1.4 6-2.3 12-8.3 13.4-.1 0-.2 0-.3.1-22.5 4.7-36.9 26.7-32.2 49.2 4 19.3 21 33.1 40.7 33.1h138.4c6.1.2 11 5.3 10.8 11.5-.2 5.9-4.9 10.6-10.8 10.8H99.8c-35.3 0-63.8-28.6-63.8-63.9 0-26.3 16.1-49.8 40.5-59.4-.1-1.8-.2-3.6-.2-5.4 0-38 30.8-68.7 68.8-68.7 6.6 0 13.2 1 19.5 2.8C196.6-4.7 255.9-12 297 20.1c26.6 20.7 40.1 54 35.4 87.4 33 12.4 49.6 49.3 37.2 82.3-9.3 24.8-33.2 41.2-59.7 41.2z"></path><path class="lineal-stroke" d="M204.8 334.3c-6.1 0-11.1-5-11.1-11.1V220.8c-.2-6.1 4.6-11.3 10.8-11.5 6.1-.2 11.3 4.6 11.5 10.8v103.1c-.1 6.1-5.1 11.1-11.2 11.1z"></path><path class="lineal-stroke" d="M398.5 334.3H11.1C5 334.1.1 329 .3 322.8c.2-5.9 4.9-10.6 10.8-10.8h387.4c6.1.2 11 5.3 10.8 11.5-.2 5.9-4.9 10.6-10.8 10.8z"></path><path class="lineal-fill" d="M234.8 350.1h-60.1c-8 0-14.5-6.5-14.5-14.4v-25c0-8 6.5-14.5 14.4-14.5h60.1c8 0 14.5 6.5 14.5 14.5v25c.1 7.9-6.4 14.4-14.4 14.4z"></path><path class="lineal-stroke" d="M234.8 361.2h-60.1c-14.1 0-25.6-11.5-25.6-25.6v-25c0-14.1 11.5-25.6 25.6-25.6h60.1c14.1 0 25.6 11.5 25.6 25.6v25c0 14.2-11.4 25.6-25.6 25.6zm-60-53.9c-1.8 0-3.3 1.5-3.3 3.3v25c0 1.8 1.5 3.3 3.3 3.3h60.1c1.8 0 3.3-1.5 3.3-3.3v-25c0-1.8-1.5-3.3-3.3-3.3h-60.1zM71.3 356.5c-6.1 0-11.1-5-11.1-11.1v-44.5c.2-6.1 5.3-11 11.5-10.8 5.9.2 10.6 4.9 10.8 10.8v44.5c-.1 6.1-5.1 11.1-11.2 11.1zm267 0c-6.1 0-11.1-5-11.1-11.1v-44.5c.2-6.1 5.3-11 11.5-10.8 5.9.2 10.6 4.9 10.8 10.8v44.5c-.1 6.1-5.1 11.1-11.2 11.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 361.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/cloud-computing-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M309.9 231h-12.7c-6.1.2-11.3-4.6-11.5-10.8-.2-6.1 4.6-11.3 10.8-11.5h13.4c23 0 41.6-18.7 41.6-41.6 0-20-14.3-37.1-33.9-40.8-6-1.1-10-6.9-8.9-13 0-.3.1-.5.2-.7 10-38.6-13.2-78-51.8-88-5.9-1.5-11.9-2.3-18-2.3-24.7-.1-47.7 12.6-60.9 33.5-3 4.7-8.9 6.5-14 4.2-23.4-10.6-50.9-.2-61.5 23.2-2.7 6-4.1 12.5-4.1 19.1 0 3.6.4 7.2 1.3 10.7 1.4 6-2.3 12-8.3 13.4-.1 0-.2 0-.3.1-22.5 4.7-36.9 26.7-32.2 49.2 4 19.3 21 33.1 40.7 33.1h138.4c6.1.2 11 5.3 10.8 11.5-.2 5.9-4.9 10.6-10.8 10.8H99.8c-35.3 0-63.8-28.6-63.8-63.9 0-26.3 16.1-49.8 40.5-59.4-.1-1.8-.2-3.6-.2-5.4 0-38 30.8-68.7 68.8-68.7 6.6 0 13.2 1 19.5 2.8C196.6-4.7 255.9-12 297 20.1c26.6 20.7 40.1 54 35.4 87.4 33 12.4 49.6 49.3 37.2 82.3-9.3 24.8-33.2 41.2-59.7 41.2z"></path><path class="lineal-stroke" d="M204.8 334.3c-6.1 0-11.1-5-11.1-11.1V220.8c-.2-6.1 4.6-11.3 10.8-11.5 6.1-.2 11.3 4.6 11.5 10.8v103.1c-.1 6.1-5.1 11.1-11.2 11.1z"></path><path class="lineal-stroke" d="M398.5 334.3H11.1C5 334.1.1 329 .3 322.8c.2-5.9 4.9-10.6 10.8-10.8h387.4c6.1.2 11 5.3 10.8 11.5-.2 5.9-4.9 10.6-10.8 10.8z"></path><path class="lineal-fill" d="M234.8 350.1h-60.1c-8 0-14.5-6.5-14.5-14.4v-25c0-8 6.5-14.5 14.4-14.5h60.1c8 0 14.5 6.5 14.5 14.5v25c.1 7.9-6.4 14.4-14.4 14.4z"></path><path class="lineal-stroke" d="M234.8 361.2h-60.1c-14.1 0-25.6-11.5-25.6-25.6v-25c0-14.1 11.5-25.6 25.6-25.6h60.1c14.1 0 25.6 11.5 25.6 25.6v25c0 14.2-11.4 25.6-25.6 25.6zm-60-53.9c-1.8 0-3.3 1.5-3.3 3.3v25c0 1.8 1.5 3.3 3.3 3.3h60.1c1.8 0 3.3-1.5 3.3-3.3v-25c0-1.8-1.5-3.3-3.3-3.3h-60.1zM71.3 356.5c-6.1 0-11.1-5-11.1-11.1v-44.5c.2-6.1 5.3-11 11.5-10.8 5.9.2 10.6 4.9 10.8 10.8v44.5c-.1 6.1-5.1 11.1-11.2 11.1zm267 0c-6.1 0-11.1-5-11.1-11.1v-44.5c.2-6.1 5.3-11 11.5-10.8 5.9.2 10.6 4.9 10.8 10.8v44.5c-.1 6.1-5.1 11.1-11.2 11.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-computing-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cloud-computing-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/cloud-computing-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 349.06 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/coffee-cup.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M249.63 409.6H99.43a45.94 45.94 0 01-45.22-39.12l-40-275.27A11.95 11.95 0 0126 81.56h297a11.93 11.93 0 0111.8 13.65l-40 275.27a45.94 45.94 0 01-45.21 39.12zM39.83 105.42l38 261.63a21.94 21.94 0 0021.6 18.69h150.19a22 22 0 0021.61-18.69l38-261.63z"></path><path class="lineal-fill" d="M311.05 62.65h-54.91V38.93a27 27 0 00-27-27H119.92a27 27 0 00-27 27v23.72H38a26.08 26.08 0 000 52.16h273a26.08 26.08 0 000-52.16z"></path><path class="lineal-stroke" d="M311.05 126.74H38a38 38 0 010-76h43V38.93A39 39 0 01119.92 0h109.22a39 39 0 0138.93 38.93v11.79h43a38 38 0 010 76zM38 74.58a14.15 14.15 0 000 28.3h273a14.15 14.15 0 000-28.3h-54.86a11.93 11.93 0 01-11.93-11.93V38.93a15.09 15.09 0 00-15.07-15.07H119.92a15.09 15.09 0 00-15.07 15.07v23.72a11.94 11.94 0 01-11.93 11.94H38z"></path><path class="lineal-fill" d="M266.39 205h40.43l-12.3 84.68H54.53L42.24 205h165.69"></path><path class="lineal-stroke" d="M294.52 301.61h-240a11.93 11.93 0 01-11.8-10.21l-12.3-84.68a11.95 11.95 0 0111.81-13.65h165.7a11.93 11.93 0 010 23.86H56l8.82 60.82H284.2l8.8-60.82h-26.61a11.93 11.93 0 110-23.86h40.43a11.93 11.93 0 0111.8 13.65l-12.3 84.68a11.92 11.92 0 01-11.8 10.21z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 349.06 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/coffee-cup.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M249.63 409.6H99.43a45.94 45.94 0 01-45.22-39.12l-40-275.27A11.95 11.95 0 0126 81.56h297a11.93 11.93 0 0111.8 13.65l-40 275.27a45.94 45.94 0 01-45.21 39.12zM39.83 105.42l38 261.63a21.94 21.94 0 0021.6 18.69h150.19a22 22 0 0021.61-18.69l38-261.63z"></path><path class="lineal-fill" d="M311.05 62.65h-54.91V38.93a27 27 0 00-27-27H119.92a27 27 0 00-27 27v23.72H38a26.08 26.08 0 000 52.16h273a26.08 26.08 0 000-52.16z"></path><path class="lineal-stroke" d="M311.05 126.74H38a38 38 0 010-76h43V38.93A39 39 0 01119.92 0h109.22a39 39 0 0138.93 38.93v11.79h43a38 38 0 010 76zM38 74.58a14.15 14.15 0 000 28.3h273a14.15 14.15 0 000-28.3h-54.86a11.93 11.93 0 01-11.93-11.93V38.93a15.09 15.09 0 00-15.07-15.07H119.92a15.09 15.09 0 00-15.07 15.07v23.72a11.94 11.94 0 01-11.93 11.94H38z"></path><path class="lineal-fill" d="M266.39 205h40.43l-12.3 84.68H54.53L42.24 205h165.69"></path><path class="lineal-stroke" d="M294.52 301.61h-240a11.93 11.93 0 01-11.8-10.21l-12.3-84.68a11.95 11.95 0 0111.81-13.65h165.7a11.93 11.93 0 010 23.86H56l8.82 60.82H284.2l8.8-60.82h-26.61a11.93 11.93 0 110-23.86h40.43a11.93 11.93 0 0111.8 13.65l-12.3 84.68a11.92 11.92 0 01-11.8 10.21z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coffee-cup</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/coffee-cup.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/coffee-cup.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/coin.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M204.8 11.75C98.18 11.75 11.74 98.18 11.74 204.8S98.18 397.86 204.8 397.86s193.05-86.44 193.05-193.06-86.43-193-193-193zm0 322.52A129.41 129.41 0 01101.52 126.8L152 86.57a129.47 129.47 0 1152.76 247.7z"></path><path class="lineal-stroke" d="M204.8 409.6C91.87 409.6 0 317.73 0 204.8S91.87 0 204.8 0s204.8 91.87 204.8 204.8-91.87 204.8-204.8 204.8zm0-386.11c-100 0-181.31 81.33-181.31 181.31s81.33 181.31 181.31 181.31 181.31-81.34 181.31-181.31S304.77 23.49 204.8 23.49z"></path><path class="lineal-stroke" d="M204.8 346c-77.87 0-141.22-63.33-141.22-141.2a139.85 139.85 0 0128.58-85.09 11.75 11.75 0 0118.73 14.18 116.55 116.55 0 00-23.82 70.91A117.73 117.73 0 10204.8 87.07a116.53 116.53 0 00-48 10.22 11.75 11.75 0 01-9.6-21.44 139.88 139.88 0 0157.6-12.26c77.87 0 141.2 63.34 141.2 141.21S282.66 346 204.8 346z"></path><path class="lineal-stroke" d="M202.51 262.73C183 262.07 167 252 167 241.56c0-5.54 4.89-13.68 11.07-13.68 6.84 0 12.38 9.6 24.43 11.72v-26.38c-15-5.7-32.57-12.7-32.57-33.55 0-20.69 15.31-30.62 32.57-33.06v-4.56c0-2.28 2.61-4.4 6.19-4.4 3.1 0 6.19 2.12 6.19 4.4v4.07c10.1.33 29.15 2.93 29.15 14.17 0 4.4-2.93 13.36-10.1 13.36-5.37 0-8.46-5.22-19.05-6v23.75c14.82 5.53 32.08 13.19 32.08 35.17 0 20.2-13 32.41-32.08 35.5v4.73c0 2.28-3.09 4.4-6.19 4.4-3.58 0-6.19-2.12-6.19-4.4zm1.63-75.25v-19.37c-7.33 1.46-10.43 5.21-10.43 9.12 0 4.72 4.24 7.65 10.43 10.25zm9.12 30.13v21.83c5.54-1.3 9.93-4.4 9.93-10.26 0-5.37-4.07-8.8-9.93-11.57z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/coin.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M204.8 11.75C98.18 11.75 11.74 98.18 11.74 204.8S98.18 397.86 204.8 397.86s193.05-86.44 193.05-193.06-86.43-193-193-193zm0 322.52A129.41 129.41 0 01101.52 126.8L152 86.57a129.47 129.47 0 1152.76 247.7z"></path><path class="lineal-stroke" d="M204.8 409.6C91.87 409.6 0 317.73 0 204.8S91.87 0 204.8 0s204.8 91.87 204.8 204.8-91.87 204.8-204.8 204.8zm0-386.11c-100 0-181.31 81.33-181.31 181.31s81.33 181.31 181.31 181.31 181.31-81.34 181.31-181.31S304.77 23.49 204.8 23.49z"></path><path class="lineal-stroke" d="M204.8 346c-77.87 0-141.22-63.33-141.22-141.2a139.85 139.85 0 0128.58-85.09 11.75 11.75 0 0118.73 14.18 116.55 116.55 0 00-23.82 70.91A117.73 117.73 0 10204.8 87.07a116.53 116.53 0 00-48 10.22 11.75 11.75 0 01-9.6-21.44 139.88 139.88 0 0157.6-12.26c77.87 0 141.2 63.34 141.2 141.21S282.66 346 204.8 346z"></path><path class="lineal-stroke" d="M202.51 262.73C183 262.07 167 252 167 241.56c0-5.54 4.89-13.68 11.07-13.68 6.84 0 12.38 9.6 24.43 11.72v-26.38c-15-5.7-32.57-12.7-32.57-33.55 0-20.69 15.31-30.62 32.57-33.06v-4.56c0-2.28 2.61-4.4 6.19-4.4 3.1 0 6.19 2.12 6.19 4.4v4.07c10.1.33 29.15 2.93 29.15 14.17 0 4.4-2.93 13.36-10.1 13.36-5.37 0-8.46-5.22-19.05-6v23.75c14.82 5.53 32.08 13.19 32.08 35.17 0 20.2-13 32.41-32.08 35.5v4.73c0 2.28-3.09 4.4-6.19 4.4-3.58 0-6.19-2.12-6.19-4.4zm1.63-75.25v-19.37c-7.33 1.46-10.43 5.21-10.43 9.12 0 4.72 4.24 7.65 10.43 10.25zm9.12 30.13v21.83c5.54-1.3 9.93-4.4 9.93-10.26 0-5.37-4.07-8.8-9.93-11.57z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coin</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/coin.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/coin.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 383 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/compass.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M344.8 395.4c-2.9 0-5.8-.4-8.6-1-9.9-2.2-18.5-8.3-23.9-17L267.9 307c-3.1-5.2-1.4-11.9 3.8-15 5-3 11.5-1.5 14.7 3.3l44.3 70.4c4.8 7.7 15 10 22.7 5.2s10-15 5.2-22.7L206.5 106.7c-4.8-7.7-15-10-22.7-5.2-7.7 4.9-10 15-5.2 22.7l74.6 118.5c1.1 1.7 1.7 3.8 1.7 5.8v3.6c0 35-28.4 63.4-63.4 63.4s-63.4-28.4-63.4-63.4c-.2-6 4.6-11.1 10.6-11.3s11.1 4.6 11.3 10.6v.7c0 23 18.6 41.6 41.6 41.6s41.6-18.6 41.6-41.6v-.4l-72.9-115.8c-11.2-18-5.7-41.6 12.3-52.8 17.8-11.1 41.3-5.8 52.6 12l152.1 241.6c11.3 17.9 5.9 41.6-12 52.9-6.3 3.8-13.4 5.8-20.5 5.8z"></path><path class="lineal-fill" d="M23.7 380.2c12.8 8.1 29.7 4.2 37.8-8.6L213.6 130c8.3-12.6 4.8-29.6-7.9-37.9s-29.6-4.8-37.9 7.9c-.2.3-.4.6-.5.9L15.1 342.5c-8 12.8-4.2 29.7 8.6 37.7z"></path><path class="lineal-stroke" d="M38.3 395.4C17.1 395.4 0 378.2 0 357c0-7.2 2-14.3 5.9-20.4L158 95.1c11.4-17.9 35-23.1 52.9-11.8 17.7 11.3 23.1 34.7 12 52.6L70.7 377.5c-7 11.2-19.2 17.9-32.4 17.9zM190.4 99c-5.7 0-10.9 2.9-13.9 7.7L24.4 348.3c-4.8 7.7-2.5 17.9 5.2 22.7s17.9 2.5 22.7-5.2l152.1-241.6c4.8-7.7 2.5-17.9-5.2-22.7-2.6-1.6-5.7-2.5-8.8-2.5z"></path><path class="lineal-stroke" d="M218.3 87.4h-53.5c-6 0-10.9-4.9-10.9-10.9V37.7c0-20.8 16.9-37.7 37.7-37.7s37.7 16.9 37.7 37.7v38.8c-.1 6-5 10.9-11 10.9zm-42.6-21.8h31.7V37.7c0-8.7-7.1-15.8-15.9-15.8-8.7 0-15.8 7.1-15.8 15.8v27.9z"></path><path class="lineal-fill" d="M237.4 109.9c0 25.3-20.5 45.9-45.9 45.9-25.3 0-45.9-20.5-45.9-45.9 0-25.3 20.5-45.9 45.9-45.9 25.3 0 45.9 20.5 45.9 45.9 0-.1 0 0 0 0z"></path><path class="lineal-stroke" d="M191.5 166.7c-31.4 0-56.8-25.4-56.8-56.8s25.4-56.8 56.8-56.8 56.8 25.4 56.8 56.8c0 31.3-25.4 56.7-56.8 56.8zm0-91.8c-19.3 0-35 15.7-35 35s15.7 35 35 35 35-15.7 35-35-15.7-35-35-35zm179.2 334.7c-3.9 0-7.5-2-9.4-5.4L351 386.7c-3.1-5.2-1.3-11.9 3.9-15s11.9-1.3 15 3.9l10.4 17.6c3.1 5.2 1.3 11.9-3.9 15-1.8.9-3.7 1.4-5.7 1.4zm-358.4 0c-6 0-10.9-4.9-10.9-10.9 0-1.9.5-3.9 1.5-5.5l10.4-17.6c3-5.2 9.7-7 14.9-4s7 9.7 4 14.9c0 .1-.1.1-.1.2l-10.3 17.5c-2.1 3.4-5.7 5.4-9.5 5.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 383 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/compass.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M344.8 395.4c-2.9 0-5.8-.4-8.6-1-9.9-2.2-18.5-8.3-23.9-17L267.9 307c-3.1-5.2-1.4-11.9 3.8-15 5-3 11.5-1.5 14.7 3.3l44.3 70.4c4.8 7.7 15 10 22.7 5.2s10-15 5.2-22.7L206.5 106.7c-4.8-7.7-15-10-22.7-5.2-7.7 4.9-10 15-5.2 22.7l74.6 118.5c1.1 1.7 1.7 3.8 1.7 5.8v3.6c0 35-28.4 63.4-63.4 63.4s-63.4-28.4-63.4-63.4c-.2-6 4.6-11.1 10.6-11.3s11.1 4.6 11.3 10.6v.7c0 23 18.6 41.6 41.6 41.6s41.6-18.6 41.6-41.6v-.4l-72.9-115.8c-11.2-18-5.7-41.6 12.3-52.8 17.8-11.1 41.3-5.8 52.6 12l152.1 241.6c11.3 17.9 5.9 41.6-12 52.9-6.3 3.8-13.4 5.8-20.5 5.8z"></path><path class="lineal-fill" d="M23.7 380.2c12.8 8.1 29.7 4.2 37.8-8.6L213.6 130c8.3-12.6 4.8-29.6-7.9-37.9s-29.6-4.8-37.9 7.9c-.2.3-.4.6-.5.9L15.1 342.5c-8 12.8-4.2 29.7 8.6 37.7z"></path><path class="lineal-stroke" d="M38.3 395.4C17.1 395.4 0 378.2 0 357c0-7.2 2-14.3 5.9-20.4L158 95.1c11.4-17.9 35-23.1 52.9-11.8 17.7 11.3 23.1 34.7 12 52.6L70.7 377.5c-7 11.2-19.2 17.9-32.4 17.9zM190.4 99c-5.7 0-10.9 2.9-13.9 7.7L24.4 348.3c-4.8 7.7-2.5 17.9 5.2 22.7s17.9 2.5 22.7-5.2l152.1-241.6c4.8-7.7 2.5-17.9-5.2-22.7-2.6-1.6-5.7-2.5-8.8-2.5z"></path><path class="lineal-stroke" d="M218.3 87.4h-53.5c-6 0-10.9-4.9-10.9-10.9V37.7c0-20.8 16.9-37.7 37.7-37.7s37.7 16.9 37.7 37.7v38.8c-.1 6-5 10.9-11 10.9zm-42.6-21.8h31.7V37.7c0-8.7-7.1-15.8-15.9-15.8-8.7 0-15.8 7.1-15.8 15.8v27.9z"></path><path class="lineal-fill" d="M237.4 109.9c0 25.3-20.5 45.9-45.9 45.9-25.3 0-45.9-20.5-45.9-45.9 0-25.3 20.5-45.9 45.9-45.9 25.3 0 45.9 20.5 45.9 45.9 0-.1 0 0 0 0z"></path><path class="lineal-stroke" d="M191.5 166.7c-31.4 0-56.8-25.4-56.8-56.8s25.4-56.8 56.8-56.8 56.8 25.4 56.8 56.8c0 31.3-25.4 56.7-56.8 56.8zm0-91.8c-19.3 0-35 15.7-35 35s15.7 35 35 35 35-15.7 35-35-15.7-35-35-35zm179.2 334.7c-3.9 0-7.5-2-9.4-5.4L351 386.7c-3.1-5.2-1.3-11.9 3.9-15s11.9-1.3 15 3.9l10.4 17.6c3.1 5.2 1.3 11.9-3.9 15-1.8.9-3.7 1.4-5.7 1.4zm-358.4 0c-6 0-10.9-4.9-10.9-10.9 0-1.9.5-3.9 1.5-5.5l10.4-17.6c3-5.2 9.7-7 14.9-4s7 9.7 4 14.9c0 .1-.1.1-.1.2l-10.3 17.5c-2.1 3.4-5.7 5.4-9.5 5.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">compass</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/compass.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/compass.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 399.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/computer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M257 399.6H152.6V293H257v106.6zm-82.1-22.2h59.9v-62.1h-60l.1 62.1z"></path><path class="lineal-stroke" d="M363.9 337.3H45.7C20.5 337.3 0 316.8 0 291.6V45.7C0 20.5 20.5 0 45.7 0h318.2c25.2 0 45.7 20.5 45.7 45.7v245.9c0 25.2-20.5 45.7-45.7 45.7zM45.7 22.2c-13 0-23.5 10.5-23.5 23.5v245.9c0 13 10.5 23.5 23.5 23.5h318.2c13 0 23.5-10.5 23.5-23.5V45.7c0-13-10.5-23.5-23.5-23.5H45.7z"></path><path class="lineal-stroke" d="M326.3 292.9h-243c-21.5 0-38.9-17.4-38.9-38.9V83.3c0-21.5 17.5-38.9 38.9-38.9h242.9c21.5 0 38.9 17.4 38.9 38.9H343c0-9.2-7.5-16.7-16.7-16.7h-243c-9.2 0-16.7 7.5-16.7 16.7V254c0 9.2 7.5 16.7 16.7 16.7h242.9c9.2 0 16.7-7.5 16.7-16.7v-95.3h22.2V254c.1 21.5-17.3 38.9-38.8 38.9z"></path><path class="lineal-fill" d="M11.1 239.7v51.9c0 19.1 15.5 34.6 34.6 34.6h318.2c19.1 0 34.6-15.5 34.6-34.6v-51.9H11.1z"></path><path class="lineal-stroke" d="M363.9 337.3H45.7C20.5 337.3 0 316.8 0 291.6v-63h409.6v63c0 25.2-20.5 45.7-45.7 45.7zM22.2 250.8v40.8c0 13 10.5 23.5 23.5 23.5h318.2c13 0 23.5-10.5 23.5-23.5v-40.8H22.2z"></path><path class="lineal-stroke" d="M184.8 271.9h39.9v22.2h-39.9zm-68.2 105.5h176.5v22.2H116.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 399.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/computer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M257 399.6H152.6V293H257v106.6zm-82.1-22.2h59.9v-62.1h-60l.1 62.1z"></path><path class="lineal-stroke" d="M363.9 337.3H45.7C20.5 337.3 0 316.8 0 291.6V45.7C0 20.5 20.5 0 45.7 0h318.2c25.2 0 45.7 20.5 45.7 45.7v245.9c0 25.2-20.5 45.7-45.7 45.7zM45.7 22.2c-13 0-23.5 10.5-23.5 23.5v245.9c0 13 10.5 23.5 23.5 23.5h318.2c13 0 23.5-10.5 23.5-23.5V45.7c0-13-10.5-23.5-23.5-23.5H45.7z"></path><path class="lineal-stroke" d="M326.3 292.9h-243c-21.5 0-38.9-17.4-38.9-38.9V83.3c0-21.5 17.5-38.9 38.9-38.9h242.9c21.5 0 38.9 17.4 38.9 38.9H343c0-9.2-7.5-16.7-16.7-16.7h-243c-9.2 0-16.7 7.5-16.7 16.7V254c0 9.2 7.5 16.7 16.7 16.7h242.9c9.2 0 16.7-7.5 16.7-16.7v-95.3h22.2V254c.1 21.5-17.3 38.9-38.8 38.9z"></path><path class="lineal-fill" d="M11.1 239.7v51.9c0 19.1 15.5 34.6 34.6 34.6h318.2c19.1 0 34.6-15.5 34.6-34.6v-51.9H11.1z"></path><path class="lineal-stroke" d="M363.9 337.3H45.7C20.5 337.3 0 316.8 0 291.6v-63h409.6v63c0 25.2-20.5 45.7-45.7 45.7zM22.2 250.8v40.8c0 13 10.5 23.5 23.5 23.5h318.2c13 0 23.5-10.5 23.5-23.5v-40.8H22.2z"></path><path class="lineal-stroke" d="M184.8 271.9h39.9v22.2h-39.9zm-68.2 105.5h176.5v22.2H116.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">computer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/computer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/computer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 502.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/controller.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M495.8 267.3H16.2C7.3 267.3 0 260 0 251.1c0-8.9 7.3-16.2 16.2-16.2h479.6c8.9 0 16.2 7.3 16.2 16.2 0 8.9-7.3 16.2-16.2 16.2z"></path><circle class="lineal-fill" cx="198.8" cy="251.1" r="69.7"></circle><path class="lineal-stroke" d="M198.8 336.9c-47.4 0-85.9-38.4-85.9-85.9s38.4-85.9 85.9-85.9 85.9 38.4 85.9 85.9c-.2 47.5-38.6 85.9-85.9 85.9zm0-139.3c-29.5 0-53.5 23.9-53.5 53.5s23.9 53.5 53.5 53.5 53.5-23.9 53.5-53.5c-.1-29.5-24-53.4-53.5-53.5zm126.9-95.5H16.2c-8.9.2-16.4-6.8-16.6-15.8s6.8-16.4 15.8-16.6h310.3c8.9.2 16 7.7 15.8 16.6-.3 8.6-7.2 15.5-15.8 15.8zm171.8 0h-27.6c-8 .2-14.7-6.8-14.9-15.8-.2-8.9 6.1-16.4 14.2-16.6h28.3c8-.2 14.7 6.8 14.9 15.8.2 8.9-6.1 16.4-14.2 16.6h-.7z"></path><path class="lineal-stroke" d="M395.3 171.7c-8.9 0-16.2-7.3-16.2-16.2 0-8.9 7.3-16.2 16.2-16.2 29.5 0 53.5-23.9 53.5-53.5 0-29.5-23.9-53.5-53.5-53.5-29.5 0-53.5 23.9-53.5 53.5.2 8.9-6.8 16.4-15.8 16.6-8.9.2-16.4-6.8-16.6-15.8v-.8c0-47.4 38.4-85.8 85.9-85.8s85.8 38.4 85.8 85.9c.1 47.4-38.4 85.8-85.8 85.8zm-69.6 260.8H16.2c-8.9 0-16.2-7.2-16.2-16.2 0-8.9 7.2-16.2 16.2-16.2h309.5c8.9 0 16.2 7.3 16.2 16.2-.1 9-7.3 16.2-16.2 16.2zm171.7 0h-27.8c-8.1 0-14.6-7.3-14.6-16.2 0-8.9 6.5-16.2 14.6-16.2h27.8c8.1 0 14.6 7.3 14.6 16.2 0 9-6.6 16.2-14.6 16.2z"></path><path class="lineal-stroke" d="M395.3 502.2c-8.9.2-16.4-6.8-16.6-15.8s6.8-16.4 15.8-16.6h.8c29.5 0 53.5-23.9 53.5-53.5 0-29.5-23.9-53.5-53.5-53.5-29.5 0-53.5 23.9-53.5 53.5.2 8.9-6.8 16.4-15.8 16.6s-16.4-6.8-16.6-15.8v-.8c0-47.4 38.4-85.8 85.9-85.8s85.8 38.4 85.8 85.8-38.4 85.9-85.8 85.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 502.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/controller.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M495.8 267.3H16.2C7.3 267.3 0 260 0 251.1c0-8.9 7.3-16.2 16.2-16.2h479.6c8.9 0 16.2 7.3 16.2 16.2 0 8.9-7.3 16.2-16.2 16.2z"></path><circle class="lineal-fill" cx="198.8" cy="251.1" r="69.7"></circle><path class="lineal-stroke" d="M198.8 336.9c-47.4 0-85.9-38.4-85.9-85.9s38.4-85.9 85.9-85.9 85.9 38.4 85.9 85.9c-.2 47.5-38.6 85.9-85.9 85.9zm0-139.3c-29.5 0-53.5 23.9-53.5 53.5s23.9 53.5 53.5 53.5 53.5-23.9 53.5-53.5c-.1-29.5-24-53.4-53.5-53.5zm126.9-95.5H16.2c-8.9.2-16.4-6.8-16.6-15.8s6.8-16.4 15.8-16.6h310.3c8.9.2 16 7.7 15.8 16.6-.3 8.6-7.2 15.5-15.8 15.8zm171.8 0h-27.6c-8 .2-14.7-6.8-14.9-15.8-.2-8.9 6.1-16.4 14.2-16.6h28.3c8-.2 14.7 6.8 14.9 15.8.2 8.9-6.1 16.4-14.2 16.6h-.7z"></path><path class="lineal-stroke" d="M395.3 171.7c-8.9 0-16.2-7.3-16.2-16.2 0-8.9 7.3-16.2 16.2-16.2 29.5 0 53.5-23.9 53.5-53.5 0-29.5-23.9-53.5-53.5-53.5-29.5 0-53.5 23.9-53.5 53.5.2 8.9-6.8 16.4-15.8 16.6-8.9.2-16.4-6.8-16.6-15.8v-.8c0-47.4 38.4-85.8 85.9-85.8s85.8 38.4 85.8 85.9c.1 47.4-38.4 85.8-85.8 85.8zm-69.6 260.8H16.2c-8.9 0-16.2-7.2-16.2-16.2 0-8.9 7.2-16.2 16.2-16.2h309.5c8.9 0 16.2 7.3 16.2 16.2-.1 9-7.3 16.2-16.2 16.2zm171.7 0h-27.8c-8.1 0-14.6-7.3-14.6-16.2 0-8.9 6.5-16.2 14.6-16.2h27.8c8.1 0 14.6 7.3 14.6 16.2 0 9-6.6 16.2-14.6 16.2z"></path><path class="lineal-stroke" d="M395.3 502.2c-8.9.2-16.4-6.8-16.6-15.8s6.8-16.4 15.8-16.6h.8c29.5 0 53.5-23.9 53.5-53.5 0-29.5-23.9-53.5-53.5-53.5-29.5 0-53.5 23.9-53.5 53.5.2 8.9-6.8 16.4-15.8 16.6s-16.4-6.8-16.6-15.8v-.8c0-47.4 38.4-85.8 85.9-85.8s85.8 38.4 85.8 85.8-38.4 85.9-85.8 85.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">controller</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/controller.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/controller.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 355.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/controller-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M398.2 64.9H221.9c-6.3 0-11.4-5.1-11.4-11.4s5.1-11.4 11.4-11.4h176.4c6.3 0 11.4 5.1 11.4 11.4s-5.2 11.4-11.5 11.4zm-250.3 0H11.4C5.1 64.9 0 59.8 0 53.5s5.1-11.4 11.4-11.4h136.5c6.3 0 11.4 5.1 11.4 11.4s-5.1 11.4-11.4 11.4z"></path><path class="lineal-fill" d="M156.7 95.7H77.5c-7.7 0-14-6.3-14-14V25.3c0-7.7 6.3-14 14-13.9h79.2c7.7 0 14 6.2 14 13.9v56.4c0 7.8-6.3 14.1-14 14z"></path><path class="lineal-stroke" d="M156.7 107.1H77.5c-14 0-25.3-11.4-25.3-25.3V25.3C52.2 11.3 63.5 0 77.5 0h79.2c14 0 25.3 11.4 25.3 25.3v56.4c0 14-11.3 25.4-25.3 25.4zM77.5 22.8c-1.4 0-2.5 1.2-2.5 2.6v56.4c0 1.4 1.1 2.6 2.6 2.6h79.2c1.4 0 2.6-1.2 2.6-2.6V25.3c0-1.4-1.2-2.6-2.6-2.6H77.5zM398.2 313H221.9c-6.3 0-11.4-5.1-11.4-11.4s5.1-11.4 11.4-11.4h176.4c6.3 0 11.4 5.1 11.4 11.4s-5.2 11.4-11.5 11.4zm-250.3 0H11.4C5.1 313 0 307.9 0 301.6s5.1-11.4 11.4-11.4h136.5c6.3 0 11.4 5.1 11.4 11.4s-5.1 11.4-11.4 11.4z"></path><path class="lineal-fill" d="M156.7 343.7H77.5c-7.7 0-14-6.2-14-14v-56.4c0-7.7 6.3-14 14-14h79.2c7.7 0 14 6.3 14 14v56.4c0 7.8-6.3 14-14 14z"></path><path class="lineal-stroke" d="M156.7 355.1H77.5c-14 0-25.3-11.3-25.3-25.3v-56.4c0-14 11.3-25.4 25.3-25.4h79.2c14 0 25.3 11.4 25.3 25.4v56.4c0 14-11.3 25.3-25.3 25.3zm-79.2-84.3c-1.4 0-2.5 1.2-2.5 2.6v56.4c0 1.4 1.1 2.6 2.6 2.6h79.2c1.4 0 2.6-1.2 2.6-2.6v-56.4c0-1.4-1.2-2.6-2.6-2.6H77.5zm320.7-81.9H275c-6.3 0-11.4-5.1-11.4-11.4 0-6.3 5.1-11.4 11.4-11.4h123.2c6.3 0 11.4 5.1 11.4 11.4 0 6.3-5.1 11.4-11.4 11.4zm-199.1 0H11.4c-6.3 0-11.4-5.1-11.4-11.4 0-6.3 5.1-11.4 11.4-11.4h187.7c6.3 0 11.4 5.1 11.4 11.4 0 6.3-5.1 11.4-11.4 11.4z"></path><path class="lineal-fill" d="M344.1 219.7h-79.2c-7.7 0-14-6.3-14-14v-56.4c0-7.7 6.3-14 14-13.9h79.2c7.7 0 13.9 6.3 13.9 13.9v56.4c0 7.8-6.2 14-13.9 14z"></path><path class="lineal-stroke" d="M344.1 231.1h-79.2c-14 0-25.3-11.3-25.3-25.3v-56.4c0-14 11.3-25.3 25.3-25.4h79.2c14 0 25.3 11.3 25.3 25.3v56.4c0 14-11.3 25.4-25.3 25.4zm-79.2-84.3c-1.4 0-2.6 1.2-2.6 2.6v56.4c0 1.4 1.2 2.6 2.6 2.6h79.2c1.4 0 2.6-1.2 2.6-2.6v-56.4c0-1.4-1.1-2.6-2.6-2.6h-79.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 355.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/controller-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M398.2 64.9H221.9c-6.3 0-11.4-5.1-11.4-11.4s5.1-11.4 11.4-11.4h176.4c6.3 0 11.4 5.1 11.4 11.4s-5.2 11.4-11.5 11.4zm-250.3 0H11.4C5.1 64.9 0 59.8 0 53.5s5.1-11.4 11.4-11.4h136.5c6.3 0 11.4 5.1 11.4 11.4s-5.1 11.4-11.4 11.4z"></path><path class="lineal-fill" d="M156.7 95.7H77.5c-7.7 0-14-6.3-14-14V25.3c0-7.7 6.3-14 14-13.9h79.2c7.7 0 14 6.2 14 13.9v56.4c0 7.8-6.3 14.1-14 14z"></path><path class="lineal-stroke" d="M156.7 107.1H77.5c-14 0-25.3-11.4-25.3-25.3V25.3C52.2 11.3 63.5 0 77.5 0h79.2c14 0 25.3 11.4 25.3 25.3v56.4c0 14-11.3 25.4-25.3 25.4zM77.5 22.8c-1.4 0-2.5 1.2-2.5 2.6v56.4c0 1.4 1.1 2.6 2.6 2.6h79.2c1.4 0 2.6-1.2 2.6-2.6V25.3c0-1.4-1.2-2.6-2.6-2.6H77.5zM398.2 313H221.9c-6.3 0-11.4-5.1-11.4-11.4s5.1-11.4 11.4-11.4h176.4c6.3 0 11.4 5.1 11.4 11.4s-5.2 11.4-11.5 11.4zm-250.3 0H11.4C5.1 313 0 307.9 0 301.6s5.1-11.4 11.4-11.4h136.5c6.3 0 11.4 5.1 11.4 11.4s-5.1 11.4-11.4 11.4z"></path><path class="lineal-fill" d="M156.7 343.7H77.5c-7.7 0-14-6.2-14-14v-56.4c0-7.7 6.3-14 14-14h79.2c7.7 0 14 6.3 14 14v56.4c0 7.8-6.3 14-14 14z"></path><path class="lineal-stroke" d="M156.7 355.1H77.5c-14 0-25.3-11.3-25.3-25.3v-56.4c0-14 11.3-25.4 25.3-25.4h79.2c14 0 25.3 11.4 25.3 25.4v56.4c0 14-11.3 25.3-25.3 25.3zm-79.2-84.3c-1.4 0-2.5 1.2-2.5 2.6v56.4c0 1.4 1.1 2.6 2.6 2.6h79.2c1.4 0 2.6-1.2 2.6-2.6v-56.4c0-1.4-1.2-2.6-2.6-2.6H77.5zm320.7-81.9H275c-6.3 0-11.4-5.1-11.4-11.4 0-6.3 5.1-11.4 11.4-11.4h123.2c6.3 0 11.4 5.1 11.4 11.4 0 6.3-5.1 11.4-11.4 11.4zm-199.1 0H11.4c-6.3 0-11.4-5.1-11.4-11.4 0-6.3 5.1-11.4 11.4-11.4h187.7c6.3 0 11.4 5.1 11.4 11.4 0 6.3-5.1 11.4-11.4 11.4z"></path><path class="lineal-fill" d="M344.1 219.7h-79.2c-7.7 0-14-6.3-14-14v-56.4c0-7.7 6.3-14 14-13.9h79.2c7.7 0 13.9 6.3 13.9 13.9v56.4c0 7.8-6.2 14-13.9 14z"></path><path class="lineal-stroke" d="M344.1 231.1h-79.2c-14 0-25.3-11.3-25.3-25.3v-56.4c0-14 11.3-25.3 25.3-25.4h79.2c14 0 25.3 11.3 25.3 25.3v56.4c0 14-11.3 25.4-25.3 25.4zm-79.2-84.3c-1.4 0-2.6 1.2-2.6 2.6v56.4c0 1.4 1.2 2.6 2.6 2.6h79.2c1.4 0 2.6-1.2 2.6-2.6v-56.4c0-1.4-1.1-2.6-2.6-2.6h-79.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">controller-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/controller-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/controller-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/crayons.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M388 313.3l9.8 84.5-84.5-9.8"></path><path class="lineal-stroke" d="M397.8 409.6c-.5 0-.9 0-1.4-.1l-84.5-9.8c-6.5-.7-11.1-6.6-10.4-13.1.7-6.5 6.6-11.1 13.1-10.4l69.7 8-8-69.7c-.7-6.5 3.9-12.4 10.4-13.1 6.5-.7 12.4 3.9 13.1 10.4l9.8 84.5c.7 6.5-3.9 12.4-10.4 13.1-.5.1-.9.2-1.4.2z"></path><path class="lineal-fill" d="M121.2 46.5L92.7 18c-8.2-8.2-21.4-8.2-29.6 0L18 63.1c-8.2 8.2-8.2 21.4 0 29.5l28.5 28.5 74.7-74.6z"></path><path class="lineal-stroke" d="M46.5 133c-3.1 0-6.2-1.2-8.4-3.5L9.6 101.1c-12.8-12.8-12.8-33.5 0-46.3L54.8 9.6c12.8-12.8 33.5-12.8 46.3 0l28.5 28.5c4.6 4.6 4.6 12.1 0 16.7l-74.7 74.7c-2.3 2.3-5.3 3.5-8.4 3.5zM77.9 23.7c-2.4 0-4.7 1-6.4 2.7L26.3 71.5c-3.5 3.5-3.5 9.3 0 12.8l20.1 20.1 58-58-20.1-20.1c-1.7-1.7-4-2.6-6.4-2.6zM11.8 409.6c-6.5 0-11.8-5.3-11.8-11.8 0-.5 0-.9.1-1.3L9.9 312c.8-6.5 6.6-11.1 13.1-10.4s11.1 6.6 10.4 13.1l-8 69.7 69.7-8c6.5-.7 12.4 3.9 13.1 10.4.7 6.5-3.9 12.4-10.4 13.1l-84.5 9.8c-.5 0-1 0-1.5-.1z"></path><path class="lineal-fill" d="M290.3 44.6L22.9 311.9c7.4 3 14.1 7.5 19.7 13.2 8.4 8.4 13.6 18 15.2 26.6 8.5 1.6 18.2 6.8 26.6 15.2 5.7 5.6 10.2 12.3 13.2 19.7l265.5-265.5"></path><path class="lineal-stroke" d="M97.7 398.5c-.8 0-1.6-.1-2.4-.2-3.9-.8-7.1-3.6-8.6-7.3-2.4-5.9-6-11.2-10.6-15.6-6.3-6.3-13.9-10.7-20.4-11.9-4.8-.9-8.6-4.7-9.5-9.5-1.2-6.5-5.7-14.1-11.9-20.4-4.4-4.5-9.7-8.1-15.6-10.6-6.1-2.3-9.1-9.2-6.8-15.3.6-1.5 1.5-3 2.7-4.1L281.9 36.2c4.7-4.5 12.2-4.3 16.7.4 4.4 4.6 4.4 11.8 0 16.4L42.3 309.3c3.1 2.3 6 4.8 8.7 7.5 7.3 7.1 12.9 15.8 16.5 25.3 9.6 3.5 18.2 9.2 25.3 16.5 2.7 2.7 5.2 5.6 7.5 8.7l254.5-254.5c4.5-4.7 12-4.9 16.7-.4 4.7 4.5 4.9 12 .4 16.7-.1.1-.2.3-.4.4L106 395.1c-2.2 2.2-5.2 3.4-8.3 3.4z"></path><path class="lineal-stroke" d="M363.1 133c-3.1 0-6.2-1.2-8.4-3.5L280 54.8c-4.6-4.6-4.6-12.1 0-16.7l28.5-28.5c12.8-12.8 33.5-12.8 46.3 0L400 54.8c12.8 12.8 12.8 33.5 0 46.3l-28.5 28.5c-2.2 2.2-5.2 3.4-8.4 3.4zm-58-86.6l58 58 20.1-20.1c3.5-3.5 3.5-9.3 0-12.8L338 26.3c-3.5-3.5-9.3-3.5-12.8 0l-20.1 20.1zm-133.8 62c-3.1 0-6.1-1.2-8.4-3.5l-13.5-13.5c-4.6-4.6-4.6-12.1 0-16.8 4.6-4.6 12.1-4.6 16.8 0l13.5 13.5c4.6 4.6 4.6 12.1 0 16.7-2.2 2.4-5.2 3.6-8.4 3.6zm-74.7 74.8c-3.1 0-6.2-1.3-8.4-3.5l-52-52c-4.6-4.6-4.6-12.1 0-16.8s12.1-4.6 16.8 0l52 52c4.6 4.6 4.6 12.1 0 16.7-2.2 2.3-5.2 3.5-8.4 3.6zM312 398.5c-3.1 0-6.1-1.2-8.4-3.5l-73.7-73.7c-4.4-4.8-4.1-12.3.7-16.7 4.5-4.2 11.5-4.1 16 0l62.7 62.7c2.3-3.1 4.8-6 7.5-8.7 7.1-7.3 15.8-12.9 25.3-16.5 3.5-9.6 9.2-18.2 16.5-25.3 2.7-2.7 5.6-5.2 8.7-7.5l-62.7-62.7c-4.6-4.6-4.6-12.1 0-16.7s12.1-4.6 16.7 0l73.7 73.7c4.6 4.6 4.6 12.1 0 16.7-1.2 1.1-2.5 2-4 2.6-5.9 2.4-11.2 6-15.6 10.6-6.3 6.3-10.7 13.9-11.9 20.4-.9 4.8-4.7 8.6-9.5 9.5-6.5 1.2-14.1 5.6-20.4 11.9-4.6 4.4-8.2 9.7-10.6 15.6-1.7 4.6-6.1 7.6-11 7.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/crayons.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M388 313.3l9.8 84.5-84.5-9.8"></path><path class="lineal-stroke" d="M397.8 409.6c-.5 0-.9 0-1.4-.1l-84.5-9.8c-6.5-.7-11.1-6.6-10.4-13.1.7-6.5 6.6-11.1 13.1-10.4l69.7 8-8-69.7c-.7-6.5 3.9-12.4 10.4-13.1 6.5-.7 12.4 3.9 13.1 10.4l9.8 84.5c.7 6.5-3.9 12.4-10.4 13.1-.5.1-.9.2-1.4.2z"></path><path class="lineal-fill" d="M121.2 46.5L92.7 18c-8.2-8.2-21.4-8.2-29.6 0L18 63.1c-8.2 8.2-8.2 21.4 0 29.5l28.5 28.5 74.7-74.6z"></path><path class="lineal-stroke" d="M46.5 133c-3.1 0-6.2-1.2-8.4-3.5L9.6 101.1c-12.8-12.8-12.8-33.5 0-46.3L54.8 9.6c12.8-12.8 33.5-12.8 46.3 0l28.5 28.5c4.6 4.6 4.6 12.1 0 16.7l-74.7 74.7c-2.3 2.3-5.3 3.5-8.4 3.5zM77.9 23.7c-2.4 0-4.7 1-6.4 2.7L26.3 71.5c-3.5 3.5-3.5 9.3 0 12.8l20.1 20.1 58-58-20.1-20.1c-1.7-1.7-4-2.6-6.4-2.6zM11.8 409.6c-6.5 0-11.8-5.3-11.8-11.8 0-.5 0-.9.1-1.3L9.9 312c.8-6.5 6.6-11.1 13.1-10.4s11.1 6.6 10.4 13.1l-8 69.7 69.7-8c6.5-.7 12.4 3.9 13.1 10.4.7 6.5-3.9 12.4-10.4 13.1l-84.5 9.8c-.5 0-1 0-1.5-.1z"></path><path class="lineal-fill" d="M290.3 44.6L22.9 311.9c7.4 3 14.1 7.5 19.7 13.2 8.4 8.4 13.6 18 15.2 26.6 8.5 1.6 18.2 6.8 26.6 15.2 5.7 5.6 10.2 12.3 13.2 19.7l265.5-265.5"></path><path class="lineal-stroke" d="M97.7 398.5c-.8 0-1.6-.1-2.4-.2-3.9-.8-7.1-3.6-8.6-7.3-2.4-5.9-6-11.2-10.6-15.6-6.3-6.3-13.9-10.7-20.4-11.9-4.8-.9-8.6-4.7-9.5-9.5-1.2-6.5-5.7-14.1-11.9-20.4-4.4-4.5-9.7-8.1-15.6-10.6-6.1-2.3-9.1-9.2-6.8-15.3.6-1.5 1.5-3 2.7-4.1L281.9 36.2c4.7-4.5 12.2-4.3 16.7.4 4.4 4.6 4.4 11.8 0 16.4L42.3 309.3c3.1 2.3 6 4.8 8.7 7.5 7.3 7.1 12.9 15.8 16.5 25.3 9.6 3.5 18.2 9.2 25.3 16.5 2.7 2.7 5.2 5.6 7.5 8.7l254.5-254.5c4.5-4.7 12-4.9 16.7-.4 4.7 4.5 4.9 12 .4 16.7-.1.1-.2.3-.4.4L106 395.1c-2.2 2.2-5.2 3.4-8.3 3.4z"></path><path class="lineal-stroke" d="M363.1 133c-3.1 0-6.2-1.2-8.4-3.5L280 54.8c-4.6-4.6-4.6-12.1 0-16.7l28.5-28.5c12.8-12.8 33.5-12.8 46.3 0L400 54.8c12.8 12.8 12.8 33.5 0 46.3l-28.5 28.5c-2.2 2.2-5.2 3.4-8.4 3.4zm-58-86.6l58 58 20.1-20.1c3.5-3.5 3.5-9.3 0-12.8L338 26.3c-3.5-3.5-9.3-3.5-12.8 0l-20.1 20.1zm-133.8 62c-3.1 0-6.1-1.2-8.4-3.5l-13.5-13.5c-4.6-4.6-4.6-12.1 0-16.8 4.6-4.6 12.1-4.6 16.8 0l13.5 13.5c4.6 4.6 4.6 12.1 0 16.7-2.2 2.4-5.2 3.6-8.4 3.6zm-74.7 74.8c-3.1 0-6.2-1.3-8.4-3.5l-52-52c-4.6-4.6-4.6-12.1 0-16.8s12.1-4.6 16.8 0l52 52c4.6 4.6 4.6 12.1 0 16.7-2.2 2.3-5.2 3.5-8.4 3.6zM312 398.5c-3.1 0-6.1-1.2-8.4-3.5l-73.7-73.7c-4.4-4.8-4.1-12.3.7-16.7 4.5-4.2 11.5-4.1 16 0l62.7 62.7c2.3-3.1 4.8-6 7.5-8.7 7.1-7.3 15.8-12.9 25.3-16.5 3.5-9.6 9.2-18.2 16.5-25.3 2.7-2.7 5.6-5.2 8.7-7.5l-62.7-62.7c-4.6-4.6-4.6-12.1 0-16.7s12.1-4.6 16.7 0l73.7 73.7c4.6 4.6 4.6 12.1 0 16.7-1.2 1.1-2.5 2-4 2.6-5.9 2.4-11.2 6-15.6 10.6-6.3 6.3-10.7 13.9-11.9 20.4-.9 4.8-4.7 8.6-9.5 9.5-6.5 1.2-14.1 5.6-20.4 11.9-4.6 4.4-8.2 9.7-10.6 15.6-1.7 4.6-6.1 7.6-11 7.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">crayons</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/crayons.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/crayons.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/crop.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M371 365.5H77.2c-18.3 0-33-14.8-33.1-33.1V38.6C43.7 17.3 60.7-.3 82-.6s38.9 16.6 39.2 38v39.9c0 6.1-4.9 11-11 11s-11-4.9-11-11V38.6c.2-9.1-7-16.7-16.1-16.9-9.1-.2-16.7 7-16.9 16.1v294.7c0 6.1 4.9 11 11 11H371c9.1-.2 16.4-7.8 16.1-16.9-.2-8.8-7.3-15.9-16.1-16.1h-47.7c-6.1 0-11-4.9-11-11s4.9-11 11-11H371c21.3-.3 38.9 16.6 39.2 38s-16.6 38.9-38 39.2c-.4-.2-.8-.2-1.2-.2z"></path><path class="lineal-stroke" d="M237.9 310.4H110.2c-6.1 0-11-4.9-11-11V172.5c0-6.1 4.9-11 11-11s11 4.9 11 11v115.9h116.6c6.1 0 11 4.9 11 11s-4.9 11-10.9 11z"></path><path class="lineal-fill" d="M11 82.7c0-15.2 12.3-27.6 27.6-27.6h293.9c12.2 0 22 9.8 22 21.9v294c.3 15.2-11.8 27.8-27 28.1s-27.8-11.8-28.1-27V110.2H38.6C23.4 110.2 11 97.9 11 82.7z"></path><path class="lineal-stroke" d="M326.9 409.6c-21.3 0-38.6-17.3-38.6-38.6V121.2H38.6c-21.3.3-38.9-16.6-39.2-38S16 44.3 37.4 44h295.1c18.3 0 33 14.8 33.1 33.1V371c-.1 21.3-17.4 38.6-38.7 38.6zM38.6 66.1c-9.1-.2-16.7 7-16.9 16.1-.2 9.1 7 16.7 16.1 16.9h261.6c6.1 0 11 4.9 11 11V371c0 9.1 7.4 16.5 16.5 16.5s16.5-7.4 16.5-16.5V77.2c0-6.1-4.9-11-11-11l-293.8-.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/crop.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M371 365.5H77.2c-18.3 0-33-14.8-33.1-33.1V38.6C43.7 17.3 60.7-.3 82-.6s38.9 16.6 39.2 38v39.9c0 6.1-4.9 11-11 11s-11-4.9-11-11V38.6c.2-9.1-7-16.7-16.1-16.9-9.1-.2-16.7 7-16.9 16.1v294.7c0 6.1 4.9 11 11 11H371c9.1-.2 16.4-7.8 16.1-16.9-.2-8.8-7.3-15.9-16.1-16.1h-47.7c-6.1 0-11-4.9-11-11s4.9-11 11-11H371c21.3-.3 38.9 16.6 39.2 38s-16.6 38.9-38 39.2c-.4-.2-.8-.2-1.2-.2z"></path><path class="lineal-stroke" d="M237.9 310.4H110.2c-6.1 0-11-4.9-11-11V172.5c0-6.1 4.9-11 11-11s11 4.9 11 11v115.9h116.6c6.1 0 11 4.9 11 11s-4.9 11-10.9 11z"></path><path class="lineal-fill" d="M11 82.7c0-15.2 12.3-27.6 27.6-27.6h293.9c12.2 0 22 9.8 22 21.9v294c.3 15.2-11.8 27.8-27 28.1s-27.8-11.8-28.1-27V110.2H38.6C23.4 110.2 11 97.9 11 82.7z"></path><path class="lineal-stroke" d="M326.9 409.6c-21.3 0-38.6-17.3-38.6-38.6V121.2H38.6c-21.3.3-38.9-16.6-39.2-38S16 44.3 37.4 44h295.1c18.3 0 33 14.8 33.1 33.1V371c-.1 21.3-17.4 38.6-38.7 38.6zM38.6 66.1c-9.1-.2-16.7 7-16.9 16.1-.2 9.1 7 16.7 16.1 16.9h261.6c6.1 0 11 4.9 11 11V371c0 9.1 7.4 16.5 16.5 16.5s16.5-7.4 16.5-16.5V77.2c0-6.1-4.9-11-11-11l-293.8-.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">crop</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/crop.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/crop.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 332.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/design.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M350.9 54.2H58.7c-6.2.2-11.4-4.7-11.5-10.9S51.8 31.9 58 31.7h292.9c6.2-.2 11.4 4.7 11.5 10.9s-4.7 11.4-10.9 11.5c-.2.1-.4.1-.6.1zM239.8 328.9a11.182 11.182 0 01-10.6-14.8c2.8-8.3 16.2-47.4 25.6-63.6-9.5-10.1-37-40.3-49.9-66.1-12.1 23.4-39.5 54.4-50.1 66 10.1 16.5 22.7 54.9 25.4 63.6.4 1.2.6 2.4.6 3.7 0 6.2-5 11.2-11.2 11.2-4.9 0-9.3-3.2-10.7-7.9v-.1c-6.6-20.7-18.4-52.9-24.3-60.3-4.8-6.1-3.4-14.5-.8-19.8.5-.9 1.1-1.8 1.8-2.6 20.6-22.3 50.7-59.4 52.7-72.4.6-3.7 3.3-10.1 14.8-10.7 12.5-.7 16.6 4.8 17.8 9.4 5.7 21.5 40 60.3 52.7 73.4.8.8 1.5 1.8 2 2.8 2.6 5.1 4 13.3-.5 19.5-5.7 7.7-18.2 41.6-24.8 61.1-1.3 4.6-5.6 7.7-10.5 7.6z"></path><path class="lineal-stroke" d="M204.8 254.9c-6.2 0-11.2-5-11.2-11.2V167c.3-6.2 5.6-10.9 11.8-10.6 5.7.3 10.3 4.9 10.6 10.6v76.7c0 6.2-5 11.2-11.2 11.2z"></path><path class="lineal-stroke" d="M366.6 244.6c-6.2 0-11.2-5-11.2-11.2v-28.6c0-83.1-67.6-150.6-150.6-150.6S54.2 121.7 54.2 204.8v28.6c-.2 6.2-5.4 11.1-11.5 10.9-5.9-.2-10.7-4.9-10.9-10.9v-28.6c-.1-95.5 77.2-172.9 172.7-173 46 0 90.1 18.2 122.6 50.8 32.6 32.3 50.9 76.3 50.9 122.2v28.6c-.1 6.2-5.2 11.2-11.4 11.2z"></path><path class="lineal-fill" d="M220 74.7h-30.4c-9.1 0-16.5-7.4-16.5-16.5V27.7c0-9.1 7.4-16.5 16.5-16.5H220c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M220 85.9h-30.4c-15.3 0-27.7-12.4-27.7-27.7V27.7c0-15.3 12.4-27.7 27.7-27.7H220c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.4-63.5c-2.9 0-5.3 2.4-5.3 5.3v30.5c0 2.9 2.4 5.3 5.3 5.3H220c2.9 0 5.3-2.4 5.3-5.3V27.7c0-2.9-2.4-5.3-5.3-5.3h-30.4z"></path><path class="lineal-fill" d="M381.9 275.4h-30.5c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M381.9 286.6h-30.5c-15.3 0-27.7-12.4-27.7-27.7v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3h-30.5z"></path><path class="lineal-fill" d="M58.2 275.4H27.7c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5V259c0 9.1-7.4 16.5-16.5 16.4z"></path><path class="lineal-stroke" d="M58.2 286.6H27.7C12.4 286.6 0 274.2 0 258.9v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3H27.7zm234.1 109.5h-114c-6.2 0-11.2-5-11.2-11.2 0-6.2 5-11.2 11.2-11.2h114c6.2 0 11.2 5 11.2 11.2 0 6.2-5 11.2-11.2 11.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 332.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/design.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M350.9 54.2H58.7c-6.2.2-11.4-4.7-11.5-10.9S51.8 31.9 58 31.7h292.9c6.2-.2 11.4 4.7 11.5 10.9s-4.7 11.4-10.9 11.5c-.2.1-.4.1-.6.1zM239.8 328.9a11.182 11.182 0 01-10.6-14.8c2.8-8.3 16.2-47.4 25.6-63.6-9.5-10.1-37-40.3-49.9-66.1-12.1 23.4-39.5 54.4-50.1 66 10.1 16.5 22.7 54.9 25.4 63.6.4 1.2.6 2.4.6 3.7 0 6.2-5 11.2-11.2 11.2-4.9 0-9.3-3.2-10.7-7.9v-.1c-6.6-20.7-18.4-52.9-24.3-60.3-4.8-6.1-3.4-14.5-.8-19.8.5-.9 1.1-1.8 1.8-2.6 20.6-22.3 50.7-59.4 52.7-72.4.6-3.7 3.3-10.1 14.8-10.7 12.5-.7 16.6 4.8 17.8 9.4 5.7 21.5 40 60.3 52.7 73.4.8.8 1.5 1.8 2 2.8 2.6 5.1 4 13.3-.5 19.5-5.7 7.7-18.2 41.6-24.8 61.1-1.3 4.6-5.6 7.7-10.5 7.6z"></path><path class="lineal-stroke" d="M204.8 254.9c-6.2 0-11.2-5-11.2-11.2V167c.3-6.2 5.6-10.9 11.8-10.6 5.7.3 10.3 4.9 10.6 10.6v76.7c0 6.2-5 11.2-11.2 11.2z"></path><path class="lineal-stroke" d="M366.6 244.6c-6.2 0-11.2-5-11.2-11.2v-28.6c0-83.1-67.6-150.6-150.6-150.6S54.2 121.7 54.2 204.8v28.6c-.2 6.2-5.4 11.1-11.5 10.9-5.9-.2-10.7-4.9-10.9-10.9v-28.6c-.1-95.5 77.2-172.9 172.7-173 46 0 90.1 18.2 122.6 50.8 32.6 32.3 50.9 76.3 50.9 122.2v28.6c-.1 6.2-5.2 11.2-11.4 11.2z"></path><path class="lineal-fill" d="M220 74.7h-30.4c-9.1 0-16.5-7.4-16.5-16.5V27.7c0-9.1 7.4-16.5 16.5-16.5H220c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M220 85.9h-30.4c-15.3 0-27.7-12.4-27.7-27.7V27.7c0-15.3 12.4-27.7 27.7-27.7H220c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.4-63.5c-2.9 0-5.3 2.4-5.3 5.3v30.5c0 2.9 2.4 5.3 5.3 5.3H220c2.9 0 5.3-2.4 5.3-5.3V27.7c0-2.9-2.4-5.3-5.3-5.3h-30.4z"></path><path class="lineal-fill" d="M381.9 275.4h-30.5c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5v30.5c0 9.1-7.4 16.5-16.5 16.5z"></path><path class="lineal-stroke" d="M381.9 286.6h-30.5c-15.3 0-27.7-12.4-27.7-27.7v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3h-30.5z"></path><path class="lineal-fill" d="M58.2 275.4H27.7c-9.1 0-16.5-7.4-16.5-16.5v-30.5c0-9.1 7.4-16.5 16.5-16.5h30.5c9.1 0 16.5 7.4 16.5 16.5V259c0 9.1-7.4 16.5-16.5 16.4z"></path><path class="lineal-stroke" d="M58.2 286.6H27.7C12.4 286.6 0 274.2 0 258.9v-30.5c0-15.3 12.4-27.7 27.7-27.7h30.5c15.3 0 27.7 12.4 27.7 27.7v30.5c0 15.3-12.4 27.7-27.7 27.7zm-30.5-63.4c-2.9 0-5.3 2.4-5.3 5.3V259c0 2.9 2.4 5.3 5.3 5.3h30.5c2.9 0 5.3-2.4 5.3-5.3v-30.5c0-2.9-2.4-5.3-5.3-5.3H27.7zm234.1 109.5h-114c-6.2 0-11.2-5-11.2-11.2 0-6.2 5-11.2 11.2-11.2h114c6.2 0 11.2 5 11.2 11.2 0 6.2-5 11.2-11.2 11.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">design</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/design.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/design.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 375.46" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/directions.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M247.14 375.07h-53.79a11.89 11.89 0 01-11.89-11.88V221.67a11.89 11.89 0 0123.77 0v129.64h30v-47.75a11.89 11.89 0 1123.77 0v59.63a11.88 11.88 0 01-11.88 11.88zm100.57-231.88h-28.44a11.89 11.89 0 010-23.77h27.31l38.61-47.83-38.61-47.83H133v95.66h113.39a11.89 11.89 0 010 23.77H121.1a11.88 11.88 0 01-11.89-11.88V11.88A11.88 11.88 0 01121.1 0h226.61a21.26 21.26 0 0116.64 8l40.54 50.2a21.52 21.52 0 010 26.87l-40.54 50.2a21.26 21.26 0 01-16.64 8z"></path><path class="lineal-stroke" d="M170.49 65.43c-4.31-1.55-8-2.9-8-5.39s2.76-3.85 7.39-3.85a16 16 0 017.21 1.54 7.45 7.45 0 003 .84c3.37 0 4.83-3.51 4.83-5.31 0-5.71-12.54-6-15.05-6-9.18 0-19 3.56-19 13.54 0 9 8.06 12 14.55 14.43 5 1.87 9.23 3.48 9.23 7 0 3.31-3.78 4.48-7.32 4.48a13.35 13.35 0 01-8.57-3c-1.36-1-2.53-1.8-4-1.8-2.76 0-5.21 3-5.21 5.38 0 4.66 8.46 8.76 18.1 8.76 11.47 0 18.61-5.6 18.61-14.6 0-10.3-8.74-13.44-15.75-16zm56.19-13.23c0-2.3-1.38-4.63-4-4.63h-31.35c-2.64 0-4 2.33-4 4.63 0 2.71 1.69 4.68 4 4.68h9.91v35c0 2.45 2.91 3.55 5.79 3.55s5.8-1.11 5.8-3.55v-35h9.83c2.33 0 4-2 4-4.68zm23.94-1.59c-.89-2.51-4.27-3.41-7.14-3.41s-6.18.89-7.07 3.4l-14.32 39.55a3.44 3.44 0 00-.19.91c0 2.81 4.18 4.36 7.06 4.36s3.87-1.26 4.19-2.29l2.59-7.69h15.56l2.58 7.66c.33 1.06 1.32 2.32 4.19 2.32s7.06-1.66 7.06-4.36a2.45 2.45 0 00-.15-.77zm-2.06 26.47h-10.17l5.09-15.2zm47.85-2.28c5.92-2 9.16-6.62 9.16-13.13s-3.22-14.1-18.54-14.1h-14.66c-2.3 0-4.1 1.53-4.1 3.49v40.81c0 2.44 3 3.55 5.8 3.55s5.79-1.1 5.79-3.55V76.46h4.7l10.22 16.85a4.84 4.84 0 004.22 2.43c3.14 0 7-2.42 7-5.25a2.54 2.54 0 00-.57-1.6zM294 62.43c0 4-2.08 5.67-7 5.67h-7.16V56.69H287c4.81 0 7 1.77 7 5.74zm47.7-14.86h-31.33c-2.64 0-4 2.33-4 4.63 0 2.71 1.69 4.68 4 4.68h9.91v35c0 2.45 2.91 3.55 5.79 3.55s5.8-1.11 5.8-3.55v-35h9.83c2.33 0 4-2 4-4.68 0-2.3-1.38-4.63-4-4.63z"></path><path class="lineal-fill" d="M61.89 250.57h185.25V131.15H61.89a9.52 9.52 0 00-7.4 3.54L14 184.89a9.52 9.52 0 000 12L54.49 247a9.52 9.52 0 007.4 3.53z"></path><path class="lineal-stroke" d="M247.14 262.46H61.89a21.29 21.29 0 01-16.65-8L4.71 204.3a21.53 21.53 0 010-26.88l40.53-50.2a21.31 21.31 0 0116.65-8h185.25A11.88 11.88 0 01259 131.15v119.42a11.88 11.88 0 01-11.88 11.89zM63 238.69h172.26V143H63l-38.59 47.86zm213.4 136.77H162.32a11.89 11.89 0 010-23.77H276.4a11.89 11.89 0 010 23.77z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 375.46" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/directions.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M247.14 375.07h-53.79a11.89 11.89 0 01-11.89-11.88V221.67a11.89 11.89 0 0123.77 0v129.64h30v-47.75a11.89 11.89 0 1123.77 0v59.63a11.88 11.88 0 01-11.88 11.88zm100.57-231.88h-28.44a11.89 11.89 0 010-23.77h27.31l38.61-47.83-38.61-47.83H133v95.66h113.39a11.89 11.89 0 010 23.77H121.1a11.88 11.88 0 01-11.89-11.88V11.88A11.88 11.88 0 01121.1 0h226.61a21.26 21.26 0 0116.64 8l40.54 50.2a21.52 21.52 0 010 26.87l-40.54 50.2a21.26 21.26 0 01-16.64 8z"></path><path class="lineal-stroke" d="M170.49 65.43c-4.31-1.55-8-2.9-8-5.39s2.76-3.85 7.39-3.85a16 16 0 017.21 1.54 7.45 7.45 0 003 .84c3.37 0 4.83-3.51 4.83-5.31 0-5.71-12.54-6-15.05-6-9.18 0-19 3.56-19 13.54 0 9 8.06 12 14.55 14.43 5 1.87 9.23 3.48 9.23 7 0 3.31-3.78 4.48-7.32 4.48a13.35 13.35 0 01-8.57-3c-1.36-1-2.53-1.8-4-1.8-2.76 0-5.21 3-5.21 5.38 0 4.66 8.46 8.76 18.1 8.76 11.47 0 18.61-5.6 18.61-14.6 0-10.3-8.74-13.44-15.75-16zm56.19-13.23c0-2.3-1.38-4.63-4-4.63h-31.35c-2.64 0-4 2.33-4 4.63 0 2.71 1.69 4.68 4 4.68h9.91v35c0 2.45 2.91 3.55 5.79 3.55s5.8-1.11 5.8-3.55v-35h9.83c2.33 0 4-2 4-4.68zm23.94-1.59c-.89-2.51-4.27-3.41-7.14-3.41s-6.18.89-7.07 3.4l-14.32 39.55a3.44 3.44 0 00-.19.91c0 2.81 4.18 4.36 7.06 4.36s3.87-1.26 4.19-2.29l2.59-7.69h15.56l2.58 7.66c.33 1.06 1.32 2.32 4.19 2.32s7.06-1.66 7.06-4.36a2.45 2.45 0 00-.15-.77zm-2.06 26.47h-10.17l5.09-15.2zm47.85-2.28c5.92-2 9.16-6.62 9.16-13.13s-3.22-14.1-18.54-14.1h-14.66c-2.3 0-4.1 1.53-4.1 3.49v40.81c0 2.44 3 3.55 5.8 3.55s5.79-1.1 5.79-3.55V76.46h4.7l10.22 16.85a4.84 4.84 0 004.22 2.43c3.14 0 7-2.42 7-5.25a2.54 2.54 0 00-.57-1.6zM294 62.43c0 4-2.08 5.67-7 5.67h-7.16V56.69H287c4.81 0 7 1.77 7 5.74zm47.7-14.86h-31.33c-2.64 0-4 2.33-4 4.63 0 2.71 1.69 4.68 4 4.68h9.91v35c0 2.45 2.91 3.55 5.79 3.55s5.8-1.11 5.8-3.55v-35h9.83c2.33 0 4-2 4-4.68 0-2.3-1.38-4.63-4-4.63z"></path><path class="lineal-fill" d="M61.89 250.57h185.25V131.15H61.89a9.52 9.52 0 00-7.4 3.54L14 184.89a9.52 9.52 0 000 12L54.49 247a9.52 9.52 0 007.4 3.53z"></path><path class="lineal-stroke" d="M247.14 262.46H61.89a21.29 21.29 0 01-16.65-8L4.71 204.3a21.53 21.53 0 010-26.88l40.53-50.2a21.31 21.31 0 0116.65-8h185.25A11.88 11.88 0 01259 131.15v119.42a11.88 11.88 0 01-11.88 11.89zM63 238.69h172.26V143H63l-38.59 47.86zm213.4 136.77H162.32a11.89 11.89 0 010-23.77H276.4a11.89 11.89 0 010 23.77z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">directions</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/directions.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/directions.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 281.82 384" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/discount-tag.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M182.39 208.78c-16.91 0-26.22 8.48-26.22 23.88v22.07c0 15.41 9.31 23.89 26.22 23.89 16.66 0 26.21-8.71 26.21-23.89v-22.07c0-15.18-9.55-23.88-26.21-23.88zm-4.72 23.88c0-3.32 1.28-4.56 4.72-4.56 4 0 4.87 1.82 4.87 4.56v22.07c0 2.74-.83 4.57-4.87 4.57-3.44 0-4.72-1.24-4.72-4.57zm-10.41-80.31a9.78 9.78 0 00-9.14 5.52l-54.55 112.05a9.87 9.87 0 00-1.08 4.25 11.52 11.52 0 0011.6 11.13c4.21 0 8.07-2.23 9.6-5.51l54.71-112a9.64 9.64 0 00.93-4.25c0-6.67-6.24-11.14-12.07-11.14zm-67.83 6.37c-16.91 0-26.22 8.49-26.22 23.89v22.07c0 15.4 9.31 23.89 26.22 23.89 16.66 0 26.22-8.71 26.22-23.89v-22.07c0-15.18-9.56-23.89-26.22-23.89zm-4.72 23.88c0-3.32 1.28-4.56 4.72-4.56 4 0 4.88 1.83 4.88 4.56v22.08c0 2.74-.83 4.56-4.88 4.56-3.44 0-4.72-1.23-4.72-4.56z"></path><path class="lineal-fill" d="M10.96 10.96h259.9v91.74H10.96z"></path><path class="lineal-stroke" d="M270.86 0H11A11 11 0 000 11v362a11 11 0 0011 11h9.88a11 11 0 008.05-3.52L54.28 353l25.38 27.49a11 11 0 0016.1-14.87l-33.44-36.2a11 11 0 00-16.09 0l-24.32 26.31V113.66h238v242.07l-24.31-26.32a11 11 0 00-16.09 0l-30.18 32.68h-10.19L149 329.41a11 11 0 00-16.1 14.87l33.44 36.2a11 11 0 008 3.52h19.77a11 11 0 008-3.52L227.54 353l25.39 27.49A11 11 0 00261 384h9.88a11 11 0 0011-11V11a11 11 0 00-11-11zM21.91 91.75V21.91h238v69.84z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 281.82 384" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/discount-tag.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M182.39 208.78c-16.91 0-26.22 8.48-26.22 23.88v22.07c0 15.41 9.31 23.89 26.22 23.89 16.66 0 26.21-8.71 26.21-23.89v-22.07c0-15.18-9.55-23.88-26.21-23.88zm-4.72 23.88c0-3.32 1.28-4.56 4.72-4.56 4 0 4.87 1.82 4.87 4.56v22.07c0 2.74-.83 4.57-4.87 4.57-3.44 0-4.72-1.24-4.72-4.57zm-10.41-80.31a9.78 9.78 0 00-9.14 5.52l-54.55 112.05a9.87 9.87 0 00-1.08 4.25 11.52 11.52 0 0011.6 11.13c4.21 0 8.07-2.23 9.6-5.51l54.71-112a9.64 9.64 0 00.93-4.25c0-6.67-6.24-11.14-12.07-11.14zm-67.83 6.37c-16.91 0-26.22 8.49-26.22 23.89v22.07c0 15.4 9.31 23.89 26.22 23.89 16.66 0 26.22-8.71 26.22-23.89v-22.07c0-15.18-9.56-23.89-26.22-23.89zm-4.72 23.88c0-3.32 1.28-4.56 4.72-4.56 4 0 4.88 1.83 4.88 4.56v22.08c0 2.74-.83 4.56-4.88 4.56-3.44 0-4.72-1.23-4.72-4.56z"></path><path class="lineal-fill" d="M10.96 10.96h259.9v91.74H10.96z"></path><path class="lineal-stroke" d="M270.86 0H11A11 11 0 000 11v362a11 11 0 0011 11h9.88a11 11 0 008.05-3.52L54.28 353l25.38 27.49a11 11 0 0016.1-14.87l-33.44-36.2a11 11 0 00-16.09 0l-24.32 26.31V113.66h238v242.07l-24.31-26.32a11 11 0 00-16.09 0l-30.18 32.68h-10.19L149 329.41a11 11 0 00-16.1 14.87l33.44 36.2a11 11 0 008 3.52h19.77a11 11 0 008-3.52L227.54 353l25.39 27.49A11 11 0 00261 384h9.88a11 11 0 0011-11V11a11 11 0 00-11-11zM21.91 91.75V21.91h238v69.84z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">discount-tag</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/discount-tag.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/discount-tag.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 403.98 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/download.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M202 300.86l66.08-102.75h-38.86V13h-54.45v185.11h-38.86z"></path><path class="lineal-stroke" d="M202 313.88a13 13 0 01-11-6l-66-102.72a13 13 0 0111-20.07h25.83V13a13 13 0 0113-13h54.45a13 13 0 0113 13v172.09h25.83A13 13 0 01279 205.16L213 307.9a13 13 0 01-11 6zm-42.23-102.74L202 276.78l42.22-65.64h-15a13 13 0 01-13-13V26.05h-28.43v172.06a13 13 0 01-13 13z"></path><path class="lineal-stroke" d="M391 409.6H13a13 13 0 01-13-13V93.75a13 13 0 0113-13h65.91a13 13 0 110 26H26.05v276.8h351.89V106.77h-52.87a13 13 0 110-26H391a13 13 0 0113 13v302.8a13 13 0 01-13 13z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 403.98 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/download.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M202 300.86l66.08-102.75h-38.86V13h-54.45v185.11h-38.86z"></path><path class="lineal-stroke" d="M202 313.88a13 13 0 01-11-6l-66-102.72a13 13 0 0111-20.07h25.83V13a13 13 0 0113-13h54.45a13 13 0 0113 13v172.09h25.83A13 13 0 01279 205.16L213 307.9a13 13 0 01-11 6zm-42.23-102.74L202 276.78l42.22-65.64h-15a13 13 0 01-13-13V26.05h-28.43v172.06a13 13 0 01-13 13z"></path><path class="lineal-stroke" d="M391 409.6H13a13 13 0 01-13-13V93.75a13 13 0 0113-13h65.91a13 13 0 110 26H26.05v276.8h351.89V106.77h-52.87a13 13 0 110-26H391a13 13 0 0113 13v302.8a13 13 0 01-13 13z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">download</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/download.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/download.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/earth.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-28.1 5.7-55.9 17-81.7C62.1 19.4 182.8-28.1 286.6 17c45.5 19.8 82.3 55.5 103.5 100.4 12.9 27.3 19.6 57.2 19.5 87.4v4.1c-.4 23.5-4.9 46.7-13.3 68.7-2.1 5.5-4.5 11.2-7.2 16.6 0 0 0 .1-.1.1l-.1.3c-7.8 16-17.7 30.8-29.3 44.2-4.1 4.9-11.4 5.5-16.2 1.4-4.9-4.1-5.5-11.4-1.4-16.2.1-.1.1-.2.2-.2 10.4-11.9 19.1-25.2 26-39.4l.2-.3c2.4-4.9 4.5-9.8 6.4-14.7 7.4-19.5 11.4-40.1 11.8-60.9v-3.8c.1-26.8-5.9-53.3-17.3-77.6C335 54.8 257.3 13.3 178.1 25 116.6 34 62.9 75.2 38 132.3c-10 22.9-15.1 47.6-15 72.5 0 100.2 81.5 181.8 181.8 181.8 26.1.1 52-5.6 75.7-16.5 5.8-2.6 12.6.1 15.2 5.9 2.5 5.7 0 12.4-5.6 15-26.7 12.3-55.8 18.7-85.3 18.6z"></path><path class="lineal-fill" d="M398.1 204.8v3.9c-.4 22.2-4.6 44.1-12.5 64.8-2 5.4-4.3 10.6-6.8 15.7l-.1.3c-19.7-8.2-34.3-25.4-39.3-46.1l-12.2-50.7c-.7-2.8-2.5-5.3-4.9-6.8L311 179c-3.5-2.2-5.5-6.1-5.2-10.2l.8-9.8c.3-3.4 1.9-6.5 4.5-8.7l27.4-23.1c2.6-2.2 5.9-3.3 9.3-3l31.9-2c12.1 25.8 18.4 54 18.4 82.6z"></path><path class="lineal-stroke" d="M378.6 301c-1.5 0-3-.3-4.4-.9-23.1-9.6-40.2-29.7-46.1-54.1L316 195.5l-11-6.8c-7.3-4.4-11.4-12.6-10.6-21.1l.8-9.8c.6-6.4 3.6-12.3 8.6-16.5l27.3-23c4.7-3.9 10.6-6 16.7-5.7l31.2-1.9c4.7-.3 9.1 2.3 11.1 6.6 12.9 27.3 19.6 57.2 19.5 87.4v4.1c-.4 23.5-4.9 46.7-13.3 68.7-2.1 5.5-4.5 11.2-7.2 16.6 0 0 0 .1-.1.1l-.1.3c-2 4.1-6 6.5-10.3 6.5zm-61.4-131.6l10.9 6.7c5.1 3.1 8.7 8.1 10.1 13.9l12.2 50.7c2.3 9.6 7.1 18.3 13.9 25.4 2.7 2.8 5.6 5.3 8.8 7.4.6-1.4 1.1-2.8 1.6-4.1 7.4-19.5 11.4-40.1 11.8-60.9v-3.8c.1-24.2-4.8-48.2-14.2-70.5l-23.9 1.5h-1.8c-.3 0-.6.1-.8.3l-27.4 23.1c-.3.2-.4.5-.4.8l-.8 9.5z"></path><path class="lineal-fill" d="M197.9 217.9s-22.1 60.7-32 88a19.44 19.44 0 01-18.3 12.8h-.2c-8.3-.1-15.6-5.4-18.2-13.3l-25.4-75.9c-.5-1.4-1.2-2.7-2.2-3.8-1-1.1-2.2-2-3.5-2.7-7.3-3.7-13.3-19-13.3-19l-2.7-22.2c-1.5-12.6-6.9-24.3-15.4-33.7-8.1-9-18.7-15.3-30.4-18.2l-3.4-.8c-2.5-.6-4.1-3.2-3.5-5.8l.3-.9c27.5-58.3 82.2-99.1 145.9-108.8.4-.1.7.1.9.4L191 42.9c.8 1.6 1.2 3.3 1.2 5v2.3c0 3.9-2 7.5-5.4 9.6l-9.2 5.6c-2.5 1.5-4.2 3.9-5 6.6l-11.8 43.2c-1.7 6.3-8.2 10-14.5 8.3-.4-.1-.8-.2-1.2-.4l-6.9-2.6c-5-1.9-12.3-.9-19.4 1-8.7 2.3-14.8 10.3-14.8 19.3 0 8.9 5.8 16.6 14.3 19.2 7.8 2.3 14.6 20.1 36.2 20.1 0 0 38-4.8 43.2 6.9 4.3 9.8 3.8 20.9.2 30.9z"></path><path class="lineal-stroke" d="M147.6 330.1h-.2c-13.2-.1-24.9-8.6-29.1-21.1L93 233.2c-10.4-5.3-17-20.5-18.8-25-.4-.9-.6-1.9-.7-2.8l-2.6-22.2c-1.2-10.2-5.6-19.7-12.5-27.3-6.6-7.3-15.2-12.4-24.7-14.8l-3.4-.8c-8.7-2.2-14-11-11.8-19.7.3-1 .6-2 1.1-3 29-61.8 87-105.1 154.6-115.2.6-.1 1.2-.1 1.8-.1 4.7 0 8.9 2.6 11 6.8l14.4 28.8c1.6 3.2 2.4 6.6 2.4 10.2v2.3c0 7.9-4.1 15.3-10.9 19.4l-9.1 5.6-11.8 42.8c-2.8 10.1-12 17.2-22.5 17.2-2.9 0-5.8-.5-8.5-1.6l-6.8-2.6c-.8-.2-1.5-.3-2.3-.2-3.4.1-6.8.7-10 1.6-3.7 1-6.3 4.3-6.3 8.2 0 1.1.2 2.1.6 3.1.9 2.4 2.9 4.3 5.4 5 5.4 1.6 9.3 5.5 13 9.2 5.2 5.2 10.2 10.2 19.3 10.4 5.7-.6 11.5-1 17.3-1 13.1 0 31.2 1.5 37 14.8 5.2 11.8 5.4 25.8.4 39.4 0 0-22.1 60.7-32 88-4.4 12.3-16 20.4-29 20.4zm-44.2-117.4c5.4 2.7 9.4 7.4 11.3 13.1l25.4 75.9c1.1 3.2 4.1 5.4 7.4 5.4h.1c3.3 0 6.3-2.1 7.5-5.2 9.9-27.2 32-88 32-88 2.7-7.5 2.9-15 .6-21.2-1.4-.6-5.7-2.1-16.4-2.1-5.1 0-10.2.3-15.2.9-.5.1-1 .1-1.4.1-19.1 0-29.8-10.8-36.2-17.2-1.2-1.3-2.5-2.5-3.8-3.6-13.1-4.1-22-16.3-22-30 0-14.2 9.6-26.7 23.3-30.4 5.2-1.5 10.6-2.3 16-2.4 3.6-.1 7.1.5 10.4 1.7l7.1 2.7c.1 0 .1 0 .2-.1.1 0 .1-.1.1-.2L161.5 69c1.5-5.6 5.1-10.4 10.1-13.4l9.1-5.5V48l-10.8-21.6c-54.1 10.5-100.4 45-126 93.8 26.9 8.7 46.3 32.3 49.7 60.3l2.4 20.6c2.2 5 5.6 10.4 7.4 11.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/earth.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-28.1 5.7-55.9 17-81.7C62.1 19.4 182.8-28.1 286.6 17c45.5 19.8 82.3 55.5 103.5 100.4 12.9 27.3 19.6 57.2 19.5 87.4v4.1c-.4 23.5-4.9 46.7-13.3 68.7-2.1 5.5-4.5 11.2-7.2 16.6 0 0 0 .1-.1.1l-.1.3c-7.8 16-17.7 30.8-29.3 44.2-4.1 4.9-11.4 5.5-16.2 1.4-4.9-4.1-5.5-11.4-1.4-16.2.1-.1.1-.2.2-.2 10.4-11.9 19.1-25.2 26-39.4l.2-.3c2.4-4.9 4.5-9.8 6.4-14.7 7.4-19.5 11.4-40.1 11.8-60.9v-3.8c.1-26.8-5.9-53.3-17.3-77.6C335 54.8 257.3 13.3 178.1 25 116.6 34 62.9 75.2 38 132.3c-10 22.9-15.1 47.6-15 72.5 0 100.2 81.5 181.8 181.8 181.8 26.1.1 52-5.6 75.7-16.5 5.8-2.6 12.6.1 15.2 5.9 2.5 5.7 0 12.4-5.6 15-26.7 12.3-55.8 18.7-85.3 18.6z"></path><path class="lineal-fill" d="M398.1 204.8v3.9c-.4 22.2-4.6 44.1-12.5 64.8-2 5.4-4.3 10.6-6.8 15.7l-.1.3c-19.7-8.2-34.3-25.4-39.3-46.1l-12.2-50.7c-.7-2.8-2.5-5.3-4.9-6.8L311 179c-3.5-2.2-5.5-6.1-5.2-10.2l.8-9.8c.3-3.4 1.9-6.5 4.5-8.7l27.4-23.1c2.6-2.2 5.9-3.3 9.3-3l31.9-2c12.1 25.8 18.4 54 18.4 82.6z"></path><path class="lineal-stroke" d="M378.6 301c-1.5 0-3-.3-4.4-.9-23.1-9.6-40.2-29.7-46.1-54.1L316 195.5l-11-6.8c-7.3-4.4-11.4-12.6-10.6-21.1l.8-9.8c.6-6.4 3.6-12.3 8.6-16.5l27.3-23c4.7-3.9 10.6-6 16.7-5.7l31.2-1.9c4.7-.3 9.1 2.3 11.1 6.6 12.9 27.3 19.6 57.2 19.5 87.4v4.1c-.4 23.5-4.9 46.7-13.3 68.7-2.1 5.5-4.5 11.2-7.2 16.6 0 0 0 .1-.1.1l-.1.3c-2 4.1-6 6.5-10.3 6.5zm-61.4-131.6l10.9 6.7c5.1 3.1 8.7 8.1 10.1 13.9l12.2 50.7c2.3 9.6 7.1 18.3 13.9 25.4 2.7 2.8 5.6 5.3 8.8 7.4.6-1.4 1.1-2.8 1.6-4.1 7.4-19.5 11.4-40.1 11.8-60.9v-3.8c.1-24.2-4.8-48.2-14.2-70.5l-23.9 1.5h-1.8c-.3 0-.6.1-.8.3l-27.4 23.1c-.3.2-.4.5-.4.8l-.8 9.5z"></path><path class="lineal-fill" d="M197.9 217.9s-22.1 60.7-32 88a19.44 19.44 0 01-18.3 12.8h-.2c-8.3-.1-15.6-5.4-18.2-13.3l-25.4-75.9c-.5-1.4-1.2-2.7-2.2-3.8-1-1.1-2.2-2-3.5-2.7-7.3-3.7-13.3-19-13.3-19l-2.7-22.2c-1.5-12.6-6.9-24.3-15.4-33.7-8.1-9-18.7-15.3-30.4-18.2l-3.4-.8c-2.5-.6-4.1-3.2-3.5-5.8l.3-.9c27.5-58.3 82.2-99.1 145.9-108.8.4-.1.7.1.9.4L191 42.9c.8 1.6 1.2 3.3 1.2 5v2.3c0 3.9-2 7.5-5.4 9.6l-9.2 5.6c-2.5 1.5-4.2 3.9-5 6.6l-11.8 43.2c-1.7 6.3-8.2 10-14.5 8.3-.4-.1-.8-.2-1.2-.4l-6.9-2.6c-5-1.9-12.3-.9-19.4 1-8.7 2.3-14.8 10.3-14.8 19.3 0 8.9 5.8 16.6 14.3 19.2 7.8 2.3 14.6 20.1 36.2 20.1 0 0 38-4.8 43.2 6.9 4.3 9.8 3.8 20.9.2 30.9z"></path><path class="lineal-stroke" d="M147.6 330.1h-.2c-13.2-.1-24.9-8.6-29.1-21.1L93 233.2c-10.4-5.3-17-20.5-18.8-25-.4-.9-.6-1.9-.7-2.8l-2.6-22.2c-1.2-10.2-5.6-19.7-12.5-27.3-6.6-7.3-15.2-12.4-24.7-14.8l-3.4-.8c-8.7-2.2-14-11-11.8-19.7.3-1 .6-2 1.1-3 29-61.8 87-105.1 154.6-115.2.6-.1 1.2-.1 1.8-.1 4.7 0 8.9 2.6 11 6.8l14.4 28.8c1.6 3.2 2.4 6.6 2.4 10.2v2.3c0 7.9-4.1 15.3-10.9 19.4l-9.1 5.6-11.8 42.8c-2.8 10.1-12 17.2-22.5 17.2-2.9 0-5.8-.5-8.5-1.6l-6.8-2.6c-.8-.2-1.5-.3-2.3-.2-3.4.1-6.8.7-10 1.6-3.7 1-6.3 4.3-6.3 8.2 0 1.1.2 2.1.6 3.1.9 2.4 2.9 4.3 5.4 5 5.4 1.6 9.3 5.5 13 9.2 5.2 5.2 10.2 10.2 19.3 10.4 5.7-.6 11.5-1 17.3-1 13.1 0 31.2 1.5 37 14.8 5.2 11.8 5.4 25.8.4 39.4 0 0-22.1 60.7-32 88-4.4 12.3-16 20.4-29 20.4zm-44.2-117.4c5.4 2.7 9.4 7.4 11.3 13.1l25.4 75.9c1.1 3.2 4.1 5.4 7.4 5.4h.1c3.3 0 6.3-2.1 7.5-5.2 9.9-27.2 32-88 32-88 2.7-7.5 2.9-15 .6-21.2-1.4-.6-5.7-2.1-16.4-2.1-5.1 0-10.2.3-15.2.9-.5.1-1 .1-1.4.1-19.1 0-29.8-10.8-36.2-17.2-1.2-1.3-2.5-2.5-3.8-3.6-13.1-4.1-22-16.3-22-30 0-14.2 9.6-26.7 23.3-30.4 5.2-1.5 10.6-2.3 16-2.4 3.6-.1 7.1.5 10.4 1.7l7.1 2.7c.1 0 .1 0 .2-.1.1 0 .1-.1.1-.2L161.5 69c1.5-5.6 5.1-10.4 10.1-13.4l9.1-5.5V48l-10.8-21.6c-54.1 10.5-100.4 45-126 93.8 26.9 8.7 46.3 32.3 49.7 60.3l2.4 20.6c2.2 5 5.6 10.4 7.4 11.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">earth</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/earth.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/earth.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 383.99" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/edit-text.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M87 311.44h-9.22V72.54H87a7.07 7.07 0 005.7-11.24l-34-46.45a7.06 7.06 0 00-11.4 0l-34 46.45A7.06 7.06 0 0019 72.54h9.3v238.9H19a7.06 7.06 0 00-5.7 11.24l34 46.46a7.07 7.07 0 0011.4 0l34-46.46a7.07 7.07 0 00-5.7-11.24z"></path><path class="lineal-stroke" d="M53 384a19.11 19.11 0 01-15.35-7.79l-34-46.45a19 19 0 0112.65-30.08V84.31A19 19 0 013.69 54.24l34-46.45a19 19 0 0130.7 0l34 46.45a19 19 0 01-12.66 30.07v215.36a19 19 0 0112.66 30.08l-34 46.45A19.11 19.11 0 0153 384zm-24.37-60.6L53 356.68l24.37-33.29a12 12 0 01-11.59-11.95V72.54a12 12 0 0111.58-12L53 27.3 28.68 60.59a12 12 0 0111.58 12v238.9a12 12 0 01-11.59 11.95zm299.7 55.82H214.58a29 29 0 01-29-29v-3.73A28.67 28.67 0 01211.36 318h.17c7.66-.8 9.79-1.57 10-1.65 3-1.22 3.57-2.19 3.57-2.2a15.67 15.67 0 001.24-6.76V70.09c-11.1.51-20.88 1-22.91 1.23-.83.15-6 1.62-15.22 15.64-7.93 12.04-13.73 23.39-17.21 33.7a12 12 0 01-11.32 8.1 26.37 26.37 0 01-26.34-26.34V31.1a26.37 26.37 0 0126.3-26.34h223.62A26.37 26.37 0 01409.6 31.1v71.32a26.37 26.37 0 01-26.34 26.34 12 12 0 01-11.32-8.1C368.43 110.35 362.63 99 354.69 87c-9.24-14-14.39-15.49-15.21-15.64-2-.22-11.8-.72-22.92-1.23v27.01a12 12 0 01-23.91 0V57.6a11.95 11.95 0 0112.46-12c7.73.33 33.26 1.44 37.41 2h.17c10.9 1.51 21.36 10.07 32 26.18q6.27 9.54 11 18.66V31.1a2.43 2.43 0 00-2.43-2.43H159.64a2.42 2.42 0 00-2.42 2.43v61.36a212.6 212.6 0 0111-18.65c10.61-16.12 21.07-24.68 32-26.19h.16c4.14-.52 29.69-1.62 37.42-2a12 12 0 0112.46 12v249.71a39.15 39.15 0 01-3.62 17.13c-2.94 6.1-8.3 10.78-15.95 13.92-3.48 1.46-8.64 2.51-16.64 3.35h-.16a4.82 4.82 0 00-4.35 4.8v3.73a5 5 0 005 5h113.78a5 5 0 005-5v-4.36a5 5 0 00-4.02-4.9l-1.71-.33a93.58 93.58 0 01-15.39-4.05l-.27-.11c-7.52-3.16-12.81-7.88-15.71-14.05a39.31 39.31 0 01-3.58-17V151.74a12 12 0 1123.92 0v153.72a15.84 15.84 0 001.28 6.75c.16.34 1 1.21 3.21 2.15a73.15 73.15 0 0011.16 2.8l1.58.31a29 29 0 0123.49 28.43v4.37a29 29 0 01-28.95 29z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 383.99" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/edit-text.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M87 311.44h-9.22V72.54H87a7.07 7.07 0 005.7-11.24l-34-46.45a7.06 7.06 0 00-11.4 0l-34 46.45A7.06 7.06 0 0019 72.54h9.3v238.9H19a7.06 7.06 0 00-5.7 11.24l34 46.46a7.07 7.07 0 0011.4 0l34-46.46a7.07 7.07 0 00-5.7-11.24z"></path><path class="lineal-stroke" d="M53 384a19.11 19.11 0 01-15.35-7.79l-34-46.45a19 19 0 0112.65-30.08V84.31A19 19 0 013.69 54.24l34-46.45a19 19 0 0130.7 0l34 46.45a19 19 0 01-12.66 30.07v215.36a19 19 0 0112.66 30.08l-34 46.45A19.11 19.11 0 0153 384zm-24.37-60.6L53 356.68l24.37-33.29a12 12 0 01-11.59-11.95V72.54a12 12 0 0111.58-12L53 27.3 28.68 60.59a12 12 0 0111.58 12v238.9a12 12 0 01-11.59 11.95zm299.7 55.82H214.58a29 29 0 01-29-29v-3.73A28.67 28.67 0 01211.36 318h.17c7.66-.8 9.79-1.57 10-1.65 3-1.22 3.57-2.19 3.57-2.2a15.67 15.67 0 001.24-6.76V70.09c-11.1.51-20.88 1-22.91 1.23-.83.15-6 1.62-15.22 15.64-7.93 12.04-13.73 23.39-17.21 33.7a12 12 0 01-11.32 8.1 26.37 26.37 0 01-26.34-26.34V31.1a26.37 26.37 0 0126.3-26.34h223.62A26.37 26.37 0 01409.6 31.1v71.32a26.37 26.37 0 01-26.34 26.34 12 12 0 01-11.32-8.1C368.43 110.35 362.63 99 354.69 87c-9.24-14-14.39-15.49-15.21-15.64-2-.22-11.8-.72-22.92-1.23v27.01a12 12 0 01-23.91 0V57.6a11.95 11.95 0 0112.46-12c7.73.33 33.26 1.44 37.41 2h.17c10.9 1.51 21.36 10.07 32 26.18q6.27 9.54 11 18.66V31.1a2.43 2.43 0 00-2.43-2.43H159.64a2.42 2.42 0 00-2.42 2.43v61.36a212.6 212.6 0 0111-18.65c10.61-16.12 21.07-24.68 32-26.19h.16c4.14-.52 29.69-1.62 37.42-2a12 12 0 0112.46 12v249.71a39.15 39.15 0 01-3.62 17.13c-2.94 6.1-8.3 10.78-15.95 13.92-3.48 1.46-8.64 2.51-16.64 3.35h-.16a4.82 4.82 0 00-4.35 4.8v3.73a5 5 0 005 5h113.78a5 5 0 005-5v-4.36a5 5 0 00-4.02-4.9l-1.71-.33a93.58 93.58 0 01-15.39-4.05l-.27-.11c-7.52-3.16-12.81-7.88-15.71-14.05a39.31 39.31 0 01-3.58-17V151.74a12 12 0 1123.92 0v153.72a15.84 15.84 0 001.28 6.75c.16.34 1 1.21 3.21 2.15a73.15 73.15 0 0011.16 2.8l1.58.31a29 29 0 0123.49 28.43v4.37a29 29 0 01-28.95 29z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">edit-text</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/edit-text.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/edit-text.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 395.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/email.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M483.6 395.7H53.3C23.9 395.7 0 371.9 0 342.4V53.3C0 23.9 23.9 0 53.3 0h405.4C488.1 0 512 23.9 512 53.3v222.8c0 7.9-6.4 14.2-14.2 14.2s-14.2-6.4-14.2-14.2V53.3c0-13.7-11.1-24.8-24.8-24.8H53.3c-13.7 0-24.8 11.1-24.8 24.8v289.2c0 13.7 11.1 24.8 24.8 24.8h430.3c7.9.2 14.1 6.7 13.8 14.6-.2 7.5-6.3 13.6-13.8 13.8z"></path><path class="lineal-fill" d="M497.8 53.3L256 236.4 14.2 53.3c0-21.6 17.5-39.1 39.1-39.1h405.4c21.6 0 39.1 17.5 39.1 39.1z"></path><path class="lineal-stroke" d="M256 250.6c-3.1 0-6.1-1-8.6-2.9L5.6 64.6C2.1 61.9 0 57.7 0 53.3 0 23.9 23.9 0 53.3 0h405.4C488.1 0 512 23.9 512 53.3c0 4.4-2.1 8.6-5.6 11.3L264.6 247.7c-2.5 1.9-5.5 2.9-8.6 2.9zM29.3 46.8L256 218.6 482.7 46.8c-2.9-10.9-12.8-18.4-24-18.4H53.3c-11.3.1-21.1 7.6-24 18.4zm454.2 348.7c-3.1 0-6.1-1-8.6-2.9l-99.6-75.4c-6.3-4.7-7.5-13.7-2.7-19.9 4.7-6.3 13.7-7.5 19.9-2.7l99.6 75.4c6.3 4.7 7.5 13.7 2.8 19.9-2.7 3.6-6.9 5.7-11.4 5.6zm-449-4.6c-7.9 0-14.2-6.4-14.2-14.2 0-4.5 2.1-8.7 5.6-11.4l93.5-70.8c6.3-4.7 15.2-3.5 19.9 2.7 4.7 6.3 3.5 15.2-2.7 19.9L43.1 388c-2.5 1.9-5.5 2.9-8.6 2.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 395.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/email.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M483.6 395.7H53.3C23.9 395.7 0 371.9 0 342.4V53.3C0 23.9 23.9 0 53.3 0h405.4C488.1 0 512 23.9 512 53.3v222.8c0 7.9-6.4 14.2-14.2 14.2s-14.2-6.4-14.2-14.2V53.3c0-13.7-11.1-24.8-24.8-24.8H53.3c-13.7 0-24.8 11.1-24.8 24.8v289.2c0 13.7 11.1 24.8 24.8 24.8h430.3c7.9.2 14.1 6.7 13.8 14.6-.2 7.5-6.3 13.6-13.8 13.8z"></path><path class="lineal-fill" d="M497.8 53.3L256 236.4 14.2 53.3c0-21.6 17.5-39.1 39.1-39.1h405.4c21.6 0 39.1 17.5 39.1 39.1z"></path><path class="lineal-stroke" d="M256 250.6c-3.1 0-6.1-1-8.6-2.9L5.6 64.6C2.1 61.9 0 57.7 0 53.3 0 23.9 23.9 0 53.3 0h405.4C488.1 0 512 23.9 512 53.3c0 4.4-2.1 8.6-5.6 11.3L264.6 247.7c-2.5 1.9-5.5 2.9-8.6 2.9zM29.3 46.8L256 218.6 482.7 46.8c-2.9-10.9-12.8-18.4-24-18.4H53.3c-11.3.1-21.1 7.6-24 18.4zm454.2 348.7c-3.1 0-6.1-1-8.6-2.9l-99.6-75.4c-6.3-4.7-7.5-13.7-2.7-19.9 4.7-6.3 13.7-7.5 19.9-2.7l99.6 75.4c6.3 4.7 7.5 13.7 2.8 19.9-2.7 3.6-6.9 5.7-11.4 5.6zm-449-4.6c-7.9 0-14.2-6.4-14.2-14.2 0-4.5 2.1-8.7 5.6-11.4l93.5-70.8c6.3-4.7 15.2-3.5 19.9 2.7 4.7 6.3 3.5 15.2-2.7 19.9L43.1 388c-2.5 1.9-5.5 2.9-8.6 2.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">email</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/email.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/email.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 458.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/email-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M229.3 14.7L14.7 192.2v22.1l214.6 177.5L444 214.3v-22.1z"></path><path class="lineal-stroke" d="M453.4 225.6c3.4-2.8 5.3-7 5.3-11.3v-22.1c0-4.4-2-8.5-5.3-11.3L238.7 3.4c-5.4-4.5-13.3-4.5-18.8 0L5.3 180.8c-3.4 2.8-5.3 7-5.3 11.3v305.1c0 8.1 6.6 14.7 14.7 14.7H444c8.1 0 14.7-6.6 14.7-14.7V315.9c-.2-8.1-7-14.5-15.1-14.3-7.8.2-14.1 6.5-14.3 14.3v146.2l-131-108.3 155.1-128.2zm-224-191.8l199.9 165.3v8.3l-200 165.3L40 216.1h296.8c8.1-.2 14.5-7 14.3-15.1-.2-7.8-6.5-14.1-14.3-14.3H44.4l185-152.9zm-200 211.8l131 108.3-131 108.3V245.6zm378.4 237H50.9L183.5 373l36.5 30.2c5.4 4.5 13.3 4.5 18.8 0l36.5-30.2 132.5 109.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 458.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/email-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M229.3 14.7L14.7 192.2v22.1l214.6 177.5L444 214.3v-22.1z"></path><path class="lineal-stroke" d="M453.4 225.6c3.4-2.8 5.3-7 5.3-11.3v-22.1c0-4.4-2-8.5-5.3-11.3L238.7 3.4c-5.4-4.5-13.3-4.5-18.8 0L5.3 180.8c-3.4 2.8-5.3 7-5.3 11.3v305.1c0 8.1 6.6 14.7 14.7 14.7H444c8.1 0 14.7-6.6 14.7-14.7V315.9c-.2-8.1-7-14.5-15.1-14.3-7.8.2-14.1 6.5-14.3 14.3v146.2l-131-108.3 155.1-128.2zm-224-191.8l199.9 165.3v8.3l-200 165.3L40 216.1h296.8c8.1-.2 14.5-7 14.3-15.1-.2-7.8-6.5-14.1-14.3-14.3H44.4l185-152.9zm-200 211.8l131 108.3-131 108.3V245.6zm378.4 237H50.9L183.5 373l36.5 30.2c5.4 4.5 13.3 4.5 18.8 0l36.5-30.2 132.5 109.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">email-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/email-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/email-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 397.61 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/email-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M346.85 155.07h34.01v24.17h-34.01zm-330.1 0h31.59v24.17H16.75z"></path><path class="lineal-stroke" d="M349.5 321.87H48.12A12.08 12.08 0 0136 309.79V42.47A42.52 42.52 0 0178.5 0h240.61a42.52 42.52 0 0142.47 42.47v267.32a12.08 12.08 0 01-12.08 12.08zM60.2 297.7h277.21V42.47a18.32 18.32 0 00-18.3-18.3H78.5a18.32 18.32 0 00-18.3 18.3z"></path><path class="lineal-fill" d="M349.38 397.52H48.23a36.15 36.15 0 01-36.14-36.16V176.24a10 10 0 0115.46-8.35l162.7 106.65a15.6 15.6 0 0017.12 0l162.7-106.65a10 10 0 0115.46 8.35v185.12a36.16 36.16 0 01-36.15 36.16z"></path><path class="lineal-stroke" d="M349.38 409.6H48.23A48.29 48.29 0 010 361.36V176.24a22 22 0 0134.17-18.45l162.7 106.65a3.52 3.52 0 003.87 0l162.7-106.65a22 22 0 0134.17 18.45v185.12a48.29 48.29 0 01-48.23 48.24zM24.17 180.13v181.23a24.1 24.1 0 0024.06 24.07h301.15a24.09 24.09 0 0024.06-24.07V180.13L214 284.65a27.72 27.72 0 01-30.37 0z"></path><path class="lineal-stroke" d="M27.56 398.89a12.08 12.08 0 01-6.64-22.19l56.41-37a12.08 12.08 0 1113.25 20.21l-56.4 37a12.06 12.06 0 01-6.62 2zm342.49 0a12 12 0 01-6.61-2l-162.7-106.63a3.53 3.53 0 00-3.87 0l-51.86 34A12.09 12.09 0 01131.75 304l51.87-34a27.72 27.72 0 0130.38 0l162.69 106.7a12.08 12.08 0 01-6.64 22.19zM259.23 97.07H138.38a12.09 12.09 0 110-24.17h120.85a12.09 12.09 0 110 24.17zm19.34 63.18H119a12.09 12.09 0 010-24.18h159.57a12.09 12.09 0 110 24.18z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 397.61 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/email-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M346.85 155.07h34.01v24.17h-34.01zm-330.1 0h31.59v24.17H16.75z"></path><path class="lineal-stroke" d="M349.5 321.87H48.12A12.08 12.08 0 0136 309.79V42.47A42.52 42.52 0 0178.5 0h240.61a42.52 42.52 0 0142.47 42.47v267.32a12.08 12.08 0 01-12.08 12.08zM60.2 297.7h277.21V42.47a18.32 18.32 0 00-18.3-18.3H78.5a18.32 18.32 0 00-18.3 18.3z"></path><path class="lineal-fill" d="M349.38 397.52H48.23a36.15 36.15 0 01-36.14-36.16V176.24a10 10 0 0115.46-8.35l162.7 106.65a15.6 15.6 0 0017.12 0l162.7-106.65a10 10 0 0115.46 8.35v185.12a36.16 36.16 0 01-36.15 36.16z"></path><path class="lineal-stroke" d="M349.38 409.6H48.23A48.29 48.29 0 010 361.36V176.24a22 22 0 0134.17-18.45l162.7 106.65a3.52 3.52 0 003.87 0l162.7-106.65a22 22 0 0134.17 18.45v185.12a48.29 48.29 0 01-48.23 48.24zM24.17 180.13v181.23a24.1 24.1 0 0024.06 24.07h301.15a24.09 24.09 0 0024.06-24.07V180.13L214 284.65a27.72 27.72 0 01-30.37 0z"></path><path class="lineal-stroke" d="M27.56 398.89a12.08 12.08 0 01-6.64-22.19l56.41-37a12.08 12.08 0 1113.25 20.21l-56.4 37a12.06 12.06 0 01-6.62 2zm342.49 0a12 12 0 01-6.61-2l-162.7-106.63a3.53 3.53 0 00-3.87 0l-51.86 34A12.09 12.09 0 01131.75 304l51.87-34a27.72 27.72 0 0130.38 0l162.69 106.7a12.08 12.08 0 01-6.64 22.19zM259.23 97.07H138.38a12.09 12.09 0 110-24.17h120.85a12.09 12.09 0 110 24.17zm19.34 63.18H119a12.09 12.09 0 010-24.18h159.57a12.09 12.09 0 110 24.18z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">email-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/email-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/email-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 497.83 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/exchange.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M429.13 129.53a13.4 13.4 0 00-13.4 13.39v14l-90.63-90.6a13.4 13.4 0 10-19 18.94l90.64 90.63h-14a13.4 13.4 0 000 26.79h46.36a13.39 13.39 0 0013.4-13.39v-46.37a13.4 13.4 0 00-13.37-13.39zM191.67 426.74L101 336.11h14a13.4 13.4 0 000-26.79H68.71a13.39 13.39 0 00-13.4 13.39v46.37a13.4 13.4 0 0026.79 0v-14l90.63 90.63a13.39 13.39 0 1018.94-18.94z"></path><circle class="lineal-fill" cx="138.4" cy="138.4" r="75.63"></circle><path class="lineal-stroke" d="M138.4 227.42a88.46 88.46 0 01-62.95-26.07 13.4 13.4 0 0119-18.95 62.23 62.23 0 100-88 13.4 13.4 0 01-19-19 89 89 0 1163 152z"></path><path class="lineal-stroke" d="M138.4 276.81C62.09 276.81 0 214.72 0 138.4A138.41 138.41 0 01138.4 0c76.32 0 138.4 62.09 138.4 138.4a13.4 13.4 0 11-26.79 0A111.61 111.61 0 10138.4 250a110.59 110.59 0 0081.46-35.3 13.4 13.4 0 1119.55 18.3 139 139 0 01-101.01 43.81z"></path><path class="lineal-stroke" d="M144.46 132.71v-21.54c8.6 1.51 9.89 6.27 10.09 9.08a1.36 1.36 0 001.36 1.27h9.39a1.38 1.38 0 001.37-1.46c-.61-11.81-8.71-19.41-22.21-21.12V91.7a1.36 1.36 0 00-1.36-1.37h-9.39a1.37 1.37 0 00-1.37 1.37v7.24c-14 1.78-22.24 9.94-22.24 22.58s8.2 20.8 22.24 22.57v21.54c-8.6-1.5-9.89-6.27-10.08-9.07a1.37 1.37 0 00-1.37-1.27h-9.39a1.37 1.37 0 00-1.37 1.45c.61 11.81 8.71 19.41 22.21 21.12v7.25a1.36 1.36 0 001.37 1.36h9.39a1.36 1.36 0 001.36-1.36v-7.25c14-1.77 22.25-9.93 22.25-22.57s-8.2-20.8-22.25-22.58zm-12.12-.84c-10.12-1.78-10.12-8.06-10.12-10.35s0-8.57 10.12-10.35zm12.12 33.76v-20.69c10.12 1.77 10.12 8.06 10.12 10.35s0 8.57-10.12 10.34z"></path><circle class="lineal-fill" cx="359.43" cy="373.6" r="75.63"></circle><path class="lineal-stroke" d="M359.43 462.58a88.72 88.72 0 01-62.95-26 13.39 13.39 0 0118.94-18.94 62.24 62.24 0 100-88 13.39 13.39 0 01-18.94-18.94 89 89 0 1162.95 151.93z"></path><path class="lineal-stroke" d="M359.43 512C283.11 512 221 449.91 221 373.6a138.4 138.4 0 01138.4-138.41c76.31 0 138.4 62.09 138.4 138.41a13.4 13.4 0 01-26.79 0 111.61 111.61 0 10-111.58 111.61 110.52 110.52 0 0081.45-35.31 13.4 13.4 0 0119.55 18.32 138.93 138.93 0 01-101 43.78z"></path><path class="lineal-stroke" d="M393.05 382.76a1.91 1.91 0 00-1.43-.64h-8.69a1.93 1.93 0 00-1.9 1.6 36.68 36.68 0 01-3.88 11.9c-3.07 5.41-7.44 8-13.37 8-6.51 0-11.23-2.5-14.46-7.68a30.42 30.42 0 01-3.8-9.11H371a1.94 1.94 0 001.86-1.38l2.29-7.61a1.95 1.95 0 00-1.85-2.5h-29.08v-.73c0-1.41 0-2.68.07-3.81h26.8a1.94 1.94 0 001.86-1.39l2.24-7.62a1.94 1.94 0 00-.3-1.71 2 2 0 00-1.55-.77H346a25.24 25.24 0 013.84-8.51c3.65-4.95 8.29-7.36 14.19-7.36 4.84 0 8.44 1.26 11 3.89s4.44 6.29 5.34 11a2 2 0 001.91 1.57h8.75A1.94 1.94 0 00393 358a2.12 2.12 0 00-.05-.44 32.16 32.16 0 00-8.15-18.69c-5-5.64-12-8.51-20.86-8.51-10.41 0-18.69 4.36-24.6 12.93a44.62 44.62 0 00-6.82 16.08h-9.73a1.93 1.93 0 00-1.85 1.38l-2.25 7.62a1.94 1.94 0 00.31 1.71 1.92 1.92 0 001.55.77h10.68v2c0 .85 0 1.7.05 2.54h-8.45a1.94 1.94 0 00-1.85 1.39l-2.25 7.56a1.93 1.93 0 001.86 2.49h11.8c1.55 8.89 4.81 16 9.7 21.13a27.34 27.34 0 0020.66 8.9c9.49 0 17.12-3.65 22.7-10.83 4.59-5.89 7.33-13.22 8.15-21.78a1.92 1.92 0 00-.55-1.49z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 497.83 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/exchange.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M429.13 129.53a13.4 13.4 0 00-13.4 13.39v14l-90.63-90.6a13.4 13.4 0 10-19 18.94l90.64 90.63h-14a13.4 13.4 0 000 26.79h46.36a13.39 13.39 0 0013.4-13.39v-46.37a13.4 13.4 0 00-13.37-13.39zM191.67 426.74L101 336.11h14a13.4 13.4 0 000-26.79H68.71a13.39 13.39 0 00-13.4 13.39v46.37a13.4 13.4 0 0026.79 0v-14l90.63 90.63a13.39 13.39 0 1018.94-18.94z"></path><circle class="lineal-fill" cx="138.4" cy="138.4" r="75.63"></circle><path class="lineal-stroke" d="M138.4 227.42a88.46 88.46 0 01-62.95-26.07 13.4 13.4 0 0119-18.95 62.23 62.23 0 100-88 13.4 13.4 0 01-19-19 89 89 0 1163 152z"></path><path class="lineal-stroke" d="M138.4 276.81C62.09 276.81 0 214.72 0 138.4A138.41 138.41 0 01138.4 0c76.32 0 138.4 62.09 138.4 138.4a13.4 13.4 0 11-26.79 0A111.61 111.61 0 10138.4 250a110.59 110.59 0 0081.46-35.3 13.4 13.4 0 1119.55 18.3 139 139 0 01-101.01 43.81z"></path><path class="lineal-stroke" d="M144.46 132.71v-21.54c8.6 1.51 9.89 6.27 10.09 9.08a1.36 1.36 0 001.36 1.27h9.39a1.38 1.38 0 001.37-1.46c-.61-11.81-8.71-19.41-22.21-21.12V91.7a1.36 1.36 0 00-1.36-1.37h-9.39a1.37 1.37 0 00-1.37 1.37v7.24c-14 1.78-22.24 9.94-22.24 22.58s8.2 20.8 22.24 22.57v21.54c-8.6-1.5-9.89-6.27-10.08-9.07a1.37 1.37 0 00-1.37-1.27h-9.39a1.37 1.37 0 00-1.37 1.45c.61 11.81 8.71 19.41 22.21 21.12v7.25a1.36 1.36 0 001.37 1.36h9.39a1.36 1.36 0 001.36-1.36v-7.25c14-1.77 22.25-9.93 22.25-22.57s-8.2-20.8-22.25-22.58zm-12.12-.84c-10.12-1.78-10.12-8.06-10.12-10.35s0-8.57 10.12-10.35zm12.12 33.76v-20.69c10.12 1.77 10.12 8.06 10.12 10.35s0 8.57-10.12 10.34z"></path><circle class="lineal-fill" cx="359.43" cy="373.6" r="75.63"></circle><path class="lineal-stroke" d="M359.43 462.58a88.72 88.72 0 01-62.95-26 13.39 13.39 0 0118.94-18.94 62.24 62.24 0 100-88 13.39 13.39 0 01-18.94-18.94 89 89 0 1162.95 151.93z"></path><path class="lineal-stroke" d="M359.43 512C283.11 512 221 449.91 221 373.6a138.4 138.4 0 01138.4-138.41c76.31 0 138.4 62.09 138.4 138.41a13.4 13.4 0 01-26.79 0 111.61 111.61 0 10-111.58 111.61 110.52 110.52 0 0081.45-35.31 13.4 13.4 0 0119.55 18.32 138.93 138.93 0 01-101 43.78z"></path><path class="lineal-stroke" d="M393.05 382.76a1.91 1.91 0 00-1.43-.64h-8.69a1.93 1.93 0 00-1.9 1.6 36.68 36.68 0 01-3.88 11.9c-3.07 5.41-7.44 8-13.37 8-6.51 0-11.23-2.5-14.46-7.68a30.42 30.42 0 01-3.8-9.11H371a1.94 1.94 0 001.86-1.38l2.29-7.61a1.95 1.95 0 00-1.85-2.5h-29.08v-.73c0-1.41 0-2.68.07-3.81h26.8a1.94 1.94 0 001.86-1.39l2.24-7.62a1.94 1.94 0 00-.3-1.71 2 2 0 00-1.55-.77H346a25.24 25.24 0 013.84-8.51c3.65-4.95 8.29-7.36 14.19-7.36 4.84 0 8.44 1.26 11 3.89s4.44 6.29 5.34 11a2 2 0 001.91 1.57h8.75A1.94 1.94 0 00393 358a2.12 2.12 0 00-.05-.44 32.16 32.16 0 00-8.15-18.69c-5-5.64-12-8.51-20.86-8.51-10.41 0-18.69 4.36-24.6 12.93a44.62 44.62 0 00-6.82 16.08h-9.73a1.93 1.93 0 00-1.85 1.38l-2.25 7.62a1.94 1.94 0 00.31 1.71 1.92 1.92 0 001.55.77h10.68v2c0 .85 0 1.7.05 2.54h-8.45a1.94 1.94 0 00-1.85 1.39l-2.25 7.56a1.93 1.93 0 001.86 2.49h11.8c1.55 8.89 4.81 16 9.7 21.13a27.34 27.34 0 0020.66 8.9c9.49 0 17.12-3.65 22.7-10.83 4.59-5.89 7.33-13.22 8.15-21.78a1.92 1.92 0 00-.55-1.49z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">exchange</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/exchange.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/exchange.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.97" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/expand.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M340.41 225.21a14.18 14.18 0 01-10.08-4.21l-40.65-40.65a14.24 14.24 0 010-20.16L417.44 32.46a14.26 14.26 0 0120.17 20.16L319.93 170.3l20.48 20.49 34-34A14.26 14.26 0 01394.58 177l-44.09 44a14.18 14.18 0 01-10.08 4.21z"></path><path class="lineal-fill" d="M349.85 48.6l147.86-34.34-34.33 147.86L349.85 48.6z"></path><path class="lineal-stroke" d="M463.38 176.38a14.26 14.26 0 01-10.09-4.18L339.77 58.68a14.25 14.25 0 016.86-24L494.49.37a14.26 14.26 0 0117.11 17.12l-34.34 147.86a14.25 14.25 0 01-13.88 11zM378.1 56.68l77.2 77.2 23.35-100.55zM84.45 483.69a14.26 14.26 0 01-10.08-24.34l117.68-117.68-20.49-20.48-34 34A14.26 14.26 0 11117.4 335l44.08-44.08a14.25 14.25 0 0120.16 0l40.65 40.65a14.24 14.24 0 010 20.16L94.53 479.52a14.21 14.21 0 01-10.08 4.17z"></path><path class="lineal-fill" d="M162.12 463.38L14.26 497.71l34.33-147.86 113.53 113.53z"></path><path class="lineal-stroke" d="M14.26 512A14.25 14.25 0 01.37 494.49l34.34-147.86a14.25 14.25 0 0124-6.86L172.2 453.29a14.26 14.26 0 01-6.85 24L17.48 511.6a14.15 14.15 0 01-3.22.4zm42.41-133.9L33.32 478.65l100.56-23.35zm412.76 63.68a14.21 14.21 0 01-10.08-4.17L341.67 319.93l-20.48 20.48 34 34A14.26 14.26 0 11335 394.58l-44.06-44.08a14.26 14.26 0 010-20.17l40.65-40.65a14.26 14.26 0 0120.16 0l127.76 127.76a14.26 14.26 0 01-10.08 24.34z"></path><path class="lineal-fill" d="M463.38 349.85l34.33 147.86-147.86-34.33 113.53-113.53z"></path><path class="lineal-stroke" d="M497.71 512a14.15 14.15 0 01-3.22-.37l-147.86-34.36a14.25 14.25 0 01-6.86-24l113.52-113.5a14.26 14.26 0 0124 6.86l34.12 146.94A14.27 14.27 0 01497.87 512zM378.1 455.3l100.55 23.35L455.3 378.1zM170.3 226.47a14.21 14.21 0 01-10.08-4.17L32.46 94.54a14.26 14.26 0 0120.16-20.17L170.3 192.05l20.49-20.49-34-34A14.26 14.26 0 01177 117.4l44 44.08a14.24 14.24 0 010 20.16l-40.65 40.65a14.18 14.18 0 01-10.05 4.18z"></path><path class="lineal-fill" d="M48.59 162.12L14.26 14.26 162.12 48.6 48.59 162.12z"></path><path class="lineal-stroke" d="M48.59 176.38a14.25 14.25 0 01-13.88-11L.37 17.49A14.26 14.26 0 0117.48.37l147.86 34.34a14.25 14.25 0 016.86 24L58.68 172.2a14.24 14.24 0 01-10.09 4.18zm-15.27-143l23.35 100.5 77.21-77.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.97" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/expand.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M340.41 225.21a14.18 14.18 0 01-10.08-4.21l-40.65-40.65a14.24 14.24 0 010-20.16L417.44 32.46a14.26 14.26 0 0120.17 20.16L319.93 170.3l20.48 20.49 34-34A14.26 14.26 0 01394.58 177l-44.09 44a14.18 14.18 0 01-10.08 4.21z"></path><path class="lineal-fill" d="M349.85 48.6l147.86-34.34-34.33 147.86L349.85 48.6z"></path><path class="lineal-stroke" d="M463.38 176.38a14.26 14.26 0 01-10.09-4.18L339.77 58.68a14.25 14.25 0 016.86-24L494.49.37a14.26 14.26 0 0117.11 17.12l-34.34 147.86a14.25 14.25 0 01-13.88 11zM378.1 56.68l77.2 77.2 23.35-100.55zM84.45 483.69a14.26 14.26 0 01-10.08-24.34l117.68-117.68-20.49-20.48-34 34A14.26 14.26 0 11117.4 335l44.08-44.08a14.25 14.25 0 0120.16 0l40.65 40.65a14.24 14.24 0 010 20.16L94.53 479.52a14.21 14.21 0 01-10.08 4.17z"></path><path class="lineal-fill" d="M162.12 463.38L14.26 497.71l34.33-147.86 113.53 113.53z"></path><path class="lineal-stroke" d="M14.26 512A14.25 14.25 0 01.37 494.49l34.34-147.86a14.25 14.25 0 0124-6.86L172.2 453.29a14.26 14.26 0 01-6.85 24L17.48 511.6a14.15 14.15 0 01-3.22.4zm42.41-133.9L33.32 478.65l100.56-23.35zm412.76 63.68a14.21 14.21 0 01-10.08-4.17L341.67 319.93l-20.48 20.48 34 34A14.26 14.26 0 11335 394.58l-44.06-44.08a14.26 14.26 0 010-20.17l40.65-40.65a14.26 14.26 0 0120.16 0l127.76 127.76a14.26 14.26 0 01-10.08 24.34z"></path><path class="lineal-fill" d="M463.38 349.85l34.33 147.86-147.86-34.33 113.53-113.53z"></path><path class="lineal-stroke" d="M497.71 512a14.15 14.15 0 01-3.22-.37l-147.86-34.36a14.25 14.25 0 01-6.86-24l113.52-113.5a14.26 14.26 0 0124 6.86l34.12 146.94A14.27 14.27 0 01497.87 512zM378.1 455.3l100.55 23.35L455.3 378.1zM170.3 226.47a14.21 14.21 0 01-10.08-4.17L32.46 94.54a14.26 14.26 0 0120.16-20.17L170.3 192.05l20.49-20.49-34-34A14.26 14.26 0 01177 117.4l44 44.08a14.24 14.24 0 010 20.16l-40.65 40.65a14.18 14.18 0 01-10.05 4.18z"></path><path class="lineal-fill" d="M48.59 162.12L14.26 14.26 162.12 48.6 48.59 162.12z"></path><path class="lineal-stroke" d="M48.59 176.38a14.25 14.25 0 01-13.88-11L.37 17.49A14.26 14.26 0 0117.48.37l147.86 34.34a14.25 14.25 0 016.86 24L58.68 172.2a14.24 14.24 0 01-10.09 4.18zm-15.27-143l23.35 100.5 77.21-77.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">expand</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/expand.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/expand.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 357.39" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/fax.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M71.14 346h-38.7a21.05 21.05 0 01-21.06-21V56.34a21.06 21.06 0 0121.06-21.06h38.7a21.05 21.05 0 0121 21.06V325a21 21 0 01-21 21.05z"></path><path class="lineal-stroke" d="M71.14 357.39h-38.7A32.47 32.47 0 010 325V56.34A32.47 32.47 0 0132.44 23.9h38.7a32.47 32.47 0 0132.43 32.44V325a32.47 32.47 0 01-32.43 32.44zM32.44 46.66a9.68 9.68 0 00-9.67 9.68V325a9.67 9.67 0 009.67 9.67h38.7a9.68 9.68 0 009.67-9.67V56.34a9.69 9.69 0 00-9.67-9.68zM343 199.18H191.64a29.62 29.62 0 01-29.59-29.59V72.38a29.42 29.42 0 018.64-20.9L213.35 8.7a29.4 29.4 0 0121-8.7H343a29.63 29.63 0 0129.59 29.59v140A29.62 29.62 0 01343 199.18zM234.31 22.77a6.82 6.82 0 00-4.84 2L186.8 67.56a6.8 6.8 0 00-2 4.82v97.21a6.84 6.84 0 006.83 6.83H343a6.83 6.83 0 006.83-6.83v-140a6.84 6.84 0 00-6.83-6.82z"></path><path class="lineal-stroke" d="M380 357.39H154.65a29.63 29.63 0 01-29.59-29.6V103.57A29.62 29.62 0 01154.65 74h15.94a11.38 11.38 0 010 22.76h-15.94a6.84 6.84 0 00-6.83 6.83v224.2a6.83 6.83 0 006.83 6.83H380a6.84 6.84 0 006.83-6.83V103.57a6.84 6.84 0 00-6.83-6.82h-17.07a11.39 11.39 0 010-22.77H380a29.63 29.63 0 0129.59 29.59V327.8A29.63 29.63 0 01380 357.39z"></path><path class="lineal-stroke" d="M216.11 249.26h-30.73a11.38 11.38 0 010-22.76h30.73a11.38 11.38 0 010 22.76zm66.59 0H252a11.38 11.38 0 010-22.76h30.7a11.38 11.38 0 010 22.76zm66.58 0h-30.73a11.38 11.38 0 110-22.76h30.73a11.38 11.38 0 110 22.76zm-133.17 53.49h-30.73a11.38 11.38 0 110-22.76h30.73a11.38 11.38 0 110 22.76zm66.59 0H252a11.38 11.38 0 110-22.75h30.7a11.38 11.38 0 010 22.76zm66.58 0h-30.73a11.38 11.38 0 110-22.76h30.73a11.38 11.38 0 110 22.76z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 357.39" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/fax.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M71.14 346h-38.7a21.05 21.05 0 01-21.06-21V56.34a21.06 21.06 0 0121.06-21.06h38.7a21.05 21.05 0 0121 21.06V325a21 21 0 01-21 21.05z"></path><path class="lineal-stroke" d="M71.14 357.39h-38.7A32.47 32.47 0 010 325V56.34A32.47 32.47 0 0132.44 23.9h38.7a32.47 32.47 0 0132.43 32.44V325a32.47 32.47 0 01-32.43 32.44zM32.44 46.66a9.68 9.68 0 00-9.67 9.68V325a9.67 9.67 0 009.67 9.67h38.7a9.68 9.68 0 009.67-9.67V56.34a9.69 9.69 0 00-9.67-9.68zM343 199.18H191.64a29.62 29.62 0 01-29.59-29.59V72.38a29.42 29.42 0 018.64-20.9L213.35 8.7a29.4 29.4 0 0121-8.7H343a29.63 29.63 0 0129.59 29.59v140A29.62 29.62 0 01343 199.18zM234.31 22.77a6.82 6.82 0 00-4.84 2L186.8 67.56a6.8 6.8 0 00-2 4.82v97.21a6.84 6.84 0 006.83 6.83H343a6.83 6.83 0 006.83-6.83v-140a6.84 6.84 0 00-6.83-6.82z"></path><path class="lineal-stroke" d="M380 357.39H154.65a29.63 29.63 0 01-29.59-29.6V103.57A29.62 29.62 0 01154.65 74h15.94a11.38 11.38 0 010 22.76h-15.94a6.84 6.84 0 00-6.83 6.83v224.2a6.83 6.83 0 006.83 6.83H380a6.84 6.84 0 006.83-6.83V103.57a6.84 6.84 0 00-6.83-6.82h-17.07a11.39 11.39 0 010-22.77H380a29.63 29.63 0 0129.59 29.59V327.8A29.63 29.63 0 01380 357.39z"></path><path class="lineal-stroke" d="M216.11 249.26h-30.73a11.38 11.38 0 010-22.76h30.73a11.38 11.38 0 010 22.76zm66.59 0H252a11.38 11.38 0 010-22.76h30.7a11.38 11.38 0 010 22.76zm66.58 0h-30.73a11.38 11.38 0 110-22.76h30.73a11.38 11.38 0 110 22.76zm-133.17 53.49h-30.73a11.38 11.38 0 110-22.76h30.73a11.38 11.38 0 110 22.76zm66.59 0H252a11.38 11.38 0 110-22.75h30.7a11.38 11.38 0 010 22.76zm66.58 0h-30.73a11.38 11.38 0 110-22.76h30.73a11.38 11.38 0 110 22.76z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">fax</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/fax.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/fax.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/files.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M496.34 324.1H356.2a15.66 15.66 0 010-31.32h124.49V31.31H219.22v107.26a15.66 15.66 0 01-31.32 0V15.66A15.66 15.66 0 01203.56 0h292.78A15.66 15.66 0 01512 15.66v292.78a15.66 15.66 0 01-15.66 15.66z"></path><path class="lineal-stroke" d="M230.42 512H15.66A15.66 15.66 0 010 496.34V203.56a15.66 15.66 0 0115.66-15.66h292.78a15.66 15.66 0 0115.66 15.66v198.83a15.66 15.66 0 11-31.32 0V219.22H31.31v261.47h199.11a15.66 15.66 0 110 31.31z"></path><path class="lineal-fill" d="M109.61 109.61v93.95h198.83v198.83h93.95V109.61H109.61z"></path><path class="lineal-stroke" d="M402.39 418.05h-93.95a15.66 15.66 0 01-15.66-15.66V219.22H109.61A15.66 15.66 0 0194 203.56v-93.95A15.66 15.66 0 01109.61 94h292.78a15.66 15.66 0 0115.66 15.66v292.73a15.66 15.66 0 01-15.66 15.66zm-78.29-31.31h62.64V125.26H125.26v62.64h183.18a15.66 15.66 0 0115.66 15.66z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/files.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M496.34 324.1H356.2a15.66 15.66 0 010-31.32h124.49V31.31H219.22v107.26a15.66 15.66 0 01-31.32 0V15.66A15.66 15.66 0 01203.56 0h292.78A15.66 15.66 0 01512 15.66v292.78a15.66 15.66 0 01-15.66 15.66z"></path><path class="lineal-stroke" d="M230.42 512H15.66A15.66 15.66 0 010 496.34V203.56a15.66 15.66 0 0115.66-15.66h292.78a15.66 15.66 0 0115.66 15.66v198.83a15.66 15.66 0 11-31.32 0V219.22H31.31v261.47h199.11a15.66 15.66 0 110 31.31z"></path><path class="lineal-fill" d="M109.61 109.61v93.95h198.83v198.83h93.95V109.61H109.61z"></path><path class="lineal-stroke" d="M402.39 418.05h-93.95a15.66 15.66 0 01-15.66-15.66V219.22H109.61A15.66 15.66 0 0194 203.56v-93.95A15.66 15.66 0 01109.61 94h292.78a15.66 15.66 0 0115.66 15.66v292.73a15.66 15.66 0 01-15.66 15.66zm-78.29-31.31h62.64V125.26H125.26v62.64h183.18a15.66 15.66 0 0115.66 15.66z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">files</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/files.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/files.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507.5 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/fullscreen.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M136.1 140.7h355.7v355.7H136.1z"></path><path class="lineal-stroke" d="M491.8 125H136.1c-8.6 0-15.7 7-15.7 15.7v215H31.3v-59.3c0-8.6-7-15.7-15.7-15.7-8.6 0-15.7 7-15.7 15.7v75C0 380 7 387 15.7 387h104.8v109.3c0 8.6 7 15.7 15.7 15.7h355.7c8.6 0 15.7-7 15.7-15.7V140.7c-.1-8.7-7.2-15.7-15.8-15.7zm-15.7 355.7H151.8V156.3h324.4v324.4z"></path><path class="lineal-stroke" d="M15.7 194c8.6 0 15.7-7 15.7-15.7v-147h324.4v37.1c0 8.6 7 15.7 15.7 15.7S387 77 387 68.4V15.7C387 7 380 0 371.3 0H15.7C7 0 0 7 0 15.7v162.7C0 187 7 194 15.7 194zm299.8 138.6c4.2 0 8.1-1.6 11.1-4.6l64.8-64.8v36.4c0 8.6 7 15.7 15.7 15.7s15.7-7 15.7-15.7v-74.2c0-8.6-7-15.7-15.7-15.7h-74.2c-8.6-.2-15.8 6.6-16.1 15.3-.2 8.6 6.6 15.8 15.3 16.1h37.2l-64.8 64.8c-6.1 6.1-6.1 16 0 22.1 2.9 2.9 6.9 4.6 11 4.6zm-94.7 94.7H295c8.6-.2 15.5-7.4 15.3-16.1-.2-8.3-6.9-15-15.3-15.3h-36.4l21.4-21.4c6-6.2 5.9-16.1-.3-22.1-6.1-5.9-15.8-5.9-21.9 0l-21.4 21.4v-36.4c.2-8.6-6.6-15.8-15.3-16.1-8.6-.2-15.8 6.6-16.1 15.3v75c.1 8.7 7.1 15.7 15.8 15.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507.5 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/fullscreen.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M136.1 140.7h355.7v355.7H136.1z"></path><path class="lineal-stroke" d="M491.8 125H136.1c-8.6 0-15.7 7-15.7 15.7v215H31.3v-59.3c0-8.6-7-15.7-15.7-15.7-8.6 0-15.7 7-15.7 15.7v75C0 380 7 387 15.7 387h104.8v109.3c0 8.6 7 15.7 15.7 15.7h355.7c8.6 0 15.7-7 15.7-15.7V140.7c-.1-8.7-7.2-15.7-15.8-15.7zm-15.7 355.7H151.8V156.3h324.4v324.4z"></path><path class="lineal-stroke" d="M15.7 194c8.6 0 15.7-7 15.7-15.7v-147h324.4v37.1c0 8.6 7 15.7 15.7 15.7S387 77 387 68.4V15.7C387 7 380 0 371.3 0H15.7C7 0 0 7 0 15.7v162.7C0 187 7 194 15.7 194zm299.8 138.6c4.2 0 8.1-1.6 11.1-4.6l64.8-64.8v36.4c0 8.6 7 15.7 15.7 15.7s15.7-7 15.7-15.7v-74.2c0-8.6-7-15.7-15.7-15.7h-74.2c-8.6-.2-15.8 6.6-16.1 15.3-.2 8.6 6.6 15.8 15.3 16.1h37.2l-64.8 64.8c-6.1 6.1-6.1 16 0 22.1 2.9 2.9 6.9 4.6 11 4.6zm-94.7 94.7H295c8.6-.2 15.5-7.4 15.3-16.1-.2-8.3-6.9-15-15.3-15.3h-36.4l21.4-21.4c6-6.2 5.9-16.1-.3-22.1-6.1-5.9-15.8-5.9-21.9 0l-21.4 21.4v-36.4c.2-8.6-6.6-15.8-15.3-16.1-8.6-.2-15.8 6.6-16.1 15.3v75c.1 8.7 7.1 15.7 15.8 15.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">fullscreen</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/fullscreen.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/fullscreen.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 482.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/geolocalization.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M394.4 73.2c-40.4 12.1-94.1 19.4-153 19.4s-112.6-7.3-153-19.4c86.7-78.9 219.3-78.9 306 0zm0 336.3c-86.7 78.9-219.3 78.9-306 0 40.4-12 94.1-19.4 153-19.4s112.6 7.3 153 19.4zM170.6 170.6c-4.9 47-4.9 94.5 0 141.5 23.5 2.5 47.1 3.7 70.7 3.7s47.2-1.2 70.8-3.7c2.5-23.5 3.7-47.1 3.7-70.8 0-23.6-1.2-47.2-3.7-70.7-47-4.9-94.4-4.9-141.5 0z"></path><path class="lineal-stroke" d="M469.1 161.4C435.2 64.7 343.9.1 241.4 0h-.1C108 0 0 108.1 0 241.3v.2c0 133.2 108 241.2 241.2 241.2h.3c60.1 0 118-22.4 162.3-62.9l1.2-1.2.3-.4c.3-.3.5-.7.8-1.1.1-.1.1-.2.2-.3.6-.9 1.1-1.9 1.4-3 0-.1.1-.3.1-.4.1-.4.2-.8.3-1.3 0-.1.1-.3.1-.4.1-.5.2-1.1.2-1.6v-2.2c-.1-.5-.1-.9-.2-1.4v-.3c-.1-.6-.3-1.1-.5-1.7 0-.1-.1-.2-.1-.2-.2-.4-.4-.9-.6-1.3l-.2-.4c-.2-.4-.5-.8-.7-1.2l-.2-.3c-.3-.4-.6-.8-1-1.2l-.1-.1-.3-.3c-.3-.3-.6-.6-1-.9l-.4-.3c-.4-.3-.7-.5-1.1-.8l-.3-.2c-.5-.3-1-.6-1.5-.8h-.1l-1.5-.6-.2-.1c-24.4-7.3-52.9-12.7-83.6-16.1 4.4-18.2 7.7-36.7 10-55.2 21.6-2.6 43.1-6.7 64.1-12.2 10.6 14.4 22.4 27.8 35.4 40 5.7 5.2 14.6 4.9 19.8-.8 5.2-5.7 4.9-14.6-.8-19.8-16.6-15.3-59.7-63.2-59.7-100.8.4-27.7 23.2-49.9 50.9-49.5 27.2.4 49.1 22.3 49.5 49.5 0 16.9-8.7 37.9-25 61-4.5 6.3-3 15.1 3.3 19.6 6.3 4.5 15.1 3 19.6-3.3 19.9-28.3 30.1-54.3 30.1-77.3 0-29.2-16.6-56.2-42.9-69.5zm-167.5 94.4v.5c-.3 14.6-1.1 28.9-2.3 43l-1.7.1c-3.5.3-7 .6-10.6.8l-2.9.2c-4.2.3-8.5.5-12.8.7-.8 0-1.7.1-2.5.1-3.6.1-7.1.3-10.7.4l-3.6.1c-4.4.1-8.7.1-13.1.1-4.8 0-9.6 0-14.4-.1h-.5c-14.6-.3-28.9-1.1-43-2.3-1.2-14-2-28.4-2.3-43v-.5c-.1-4.8-.2-9.6-.2-14.4 0-4.8 0-9.6.2-14.4v-.5c.3-14.6 1.1-28.9 2.3-43 18.8-1.7 38.2-2.5 57.9-2.5 4.3 0 8.6.1 12.9.1l3.6.1c3.9.1 7.7.2 11.6.4 1.3 0 2.5.1 3.8.2 3 .1 6 .3 9 .5 1.8.1 3.5.2 5.2.3 2.9.2 5.8.4 8.8.7l3 .2c1.2 14 2 28.4 2.3 43v.5c.1 4.8.1 9.6.1 14.4s0 9.5-.1 14.3zM278.1 77.6c-12 .7-24.3 1-36.8 1s-24.7-.3-36.8-1c13.1-36.4 27.8-49.5 36.7-49.5 9.1 0 23.8 13.1 36.9 49.5zM119.6 66.2c2-1.4 3.9-2.7 5.9-4l.8-.5c1.9-1.2 3.8-2.4 5.8-3.6l.9-.6c2-1.2 4.1-2.4 6.2-3.5l1.3-.7 6.3-3.3.7-.3c2-1 4-1.9 6.1-2.9l1.1-.5c2.1-1 4.3-1.9 6.5-2.8l1.4-.5c2.2-.9 4.4-1.7 6.7-2.5l.6-.2c2.1-.8 4.3-1.5 6.5-2.2l1.2-.4c2.2-.7 4.5-1.4 6.8-2l1.4-.4c2.3-.6 4.6-1.2 7-1.8l.4-.1 1.4-.3c-6.5 10.6-12.9 24.3-18.7 42.1-19.1-1.9-38-4.8-56.7-8.8l.4-.2zm176.5 88.9c-8-.6-16.1-1.1-24.2-1.5h-.5c-2.9-.1-5.8-.2-8.8-.3l-1.4-.1c-2.7-.1-5.4-.1-8.1-.2h-1.9c-3.3-.1-6.5-.1-9.8-.1-18.5 0-36.9.7-54.7 2.1 2.3-16.8 5.5-33.4 9.6-49.9 14.8 1 29.9 1.5 45.2 1.5s30.4-.5 45.2-1.5c3.9 16.6 7.2 33.2 9.4 50zM307 75.4c-5.9-17.8-12.2-31.5-18.7-42.1l1.4.3.5.1c2.3.5 4.7 1.1 7 1.8l1.4.4c2.3.6 4.5 1.3 6.8 2l1.2.4c2.2.7 4.3 1.4 6.5 2.2l.6.2c2.2.8 4.5 1.7 6.7 2.5l1.4.5c2.2.9 4.3 1.8 6.5 2.8l1 .5c2.1.9 4.1 1.9 6.1 2.9l.7.3c2.1 1 4.2 2.2 6.4 3.3l1.3.7c2.1 1.1 4.1 2.3 6.2 3.5l.9.5c1.9 1.2 3.9 2.4 5.8 3.6l.8.5c2 1.3 4 2.6 5.9 4l.6.4c-19 3.9-38 6.8-57 8.7zM92.2 88.9c22.6 6.2 48.3 10.8 75.7 13.8-7.9 32.7-12.9 70.7-14.5 111v.3c-.1 2.8-.2 5.7-.3 8.6v.6c-.1 2.8-.1 5.5-.2 8.3v1.6c0 2.8 0 5.5-.1 8.3 0 2.8 0 5.5.1 8.3v1.6c0 2.8.1 5.5.2 8.3v.6c.1 2.9.2 5.7.3 8.6v.2c.4 9.2.9 18.2 1.6 27.1-25.9-3.6-49.7-8.8-70.1-15.5C43 267 28.1 251 28.1 241.4c0-57.4 23.1-112.3 64.1-152.5zM33.3 288.3c10.8 6.6 24.8 13 42.9 19 23.7 7.7 51.5 13.7 81.8 17.4 2.3 18.6 5.6 37 10 55.2-27.4 3-53.1 7.7-75.7 13.8-29.4-28.7-49.9-65.3-59-105.4zm323.9 132.2l-.8.5c-1.9 1.2-3.8 2.4-5.7 3.5l-1 .6c-2 1.2-4.1 2.4-6.1 3.5l-1.3.7-6.3 3.3-.8.4c-2 1-4 1.9-6 2.9l-1.1.5c-2.1 1-4.3 1.9-6.5 2.7l-1.4.5c-2.2.9-4.4 1.7-6.7 2.5l-.6.2c-2.1.8-4.3 1.5-6.4 2.2l-1.2.4c-2.2.7-4.5 1.4-6.7 2l-1.4.4c-2.3.6-4.6 1.2-7 1.8l-.5.1-1.4.3c6.5-10.6 12.9-24.4 18.7-42.1 19 1.9 38 4.8 56.7 8.8l-.6.4c-2 1.3-3.9 2.6-5.9 3.9zm-115.8 34.2c-9.1 0-23.7-13.2-36.8-49.5 12.1-.7 24.3-1 36.8-1s24.7.4 36.8 1c-13.2 36.3-27.8 49.4-36.8 49.5zm-47-5.2l-1.4-.3-.5-.1c-2.3-.5-4.6-1.1-7-1.8-.5-.1-1-.2-1.4-.4-2.3-.6-4.5-1.3-6.7-2l-1.2-.4c-2.2-.7-4.3-1.4-6.4-2.2l-.6-.2c-2.2-.8-4.5-1.7-6.7-2.5l-1.4-.5c-2.2-.9-4.3-1.8-6.5-2.7l-1.1-.5c-2-.9-4.1-1.9-6.1-2.9l-.7-.4c-2.1-1.1-4.2-2.1-6.3-3.3l-1.3-.7c-2.1-1.1-4.1-2.3-6.1-3.5l-.9-.6c-1.9-1.1-3.8-2.3-5.7-3.5l-.8-.5c-2-1.3-4-2.6-5.9-4l-.6-.4c18.7-4 37.6-6.9 56.7-8.8 5.8 17.8 12.1 31.6 18.6 42.2zm46.9-73.4c-15.3 0-30.4.5-45.2 1.5-4.1-16.4-7.3-33.1-9.6-49.9 8.9.7 18 1.2 27.1 1.6h.3c2.8.1 5.7.2 8.5.3h.6c2.7.1 5.5.1 8.3.2h1.6c2.8 0 5.5.1 8.3.1 3.4 0 6.8 0 10.2-.1l2.9-.1c2.4 0 4.9-.1 7.3-.2l3.1-.1 7.2-.3 2.8-.1c2.6-.1 5.2-.3 7.9-.4l2.1-.1c3.7-.2 7.4-.5 11.1-.8-2.3 16.8-5.5 33.4-9.6 49.9-14.4-1-29.6-1.5-44.9-1.5zm86.3-80c.7-8.9 1.2-17.9 1.6-27.1v-.2c.1-2.9.2-5.7.3-8.6v-.6c.1-2.7.1-5.5.2-8.3v-1.6c0-2.8.1-5.5.1-8.3s0-5.5-.1-8.3v-1.6c0-2.8-.1-5.5-.2-8.3v-.6c-.1-2.9-.2-5.7-.3-8.6v-.2c-.3-9.2-.9-18.2-1.6-27.1 13.1 1.8 25.8 4 37.6 6.7-6.4 11.6-9.8 24.6-9.8 37.8 0 19.2 7.3 38.8 17.2 56.5-13.8 3.4-29 6.2-45 8.4zm58.2-126.7c-20.1-5.1-40.5-8.9-61-11.4-2.3-18.6-5.6-37.1-10-55.3 27.4-3 53.1-7.7 75.7-13.8 18.8 18.4 34.1 40.1 45 64.1h-1.7c-17.4-.1-34.3 5.7-48 16.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 482.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/geolocalization.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M394.4 73.2c-40.4 12.1-94.1 19.4-153 19.4s-112.6-7.3-153-19.4c86.7-78.9 219.3-78.9 306 0zm0 336.3c-86.7 78.9-219.3 78.9-306 0 40.4-12 94.1-19.4 153-19.4s112.6 7.3 153 19.4zM170.6 170.6c-4.9 47-4.9 94.5 0 141.5 23.5 2.5 47.1 3.7 70.7 3.7s47.2-1.2 70.8-3.7c2.5-23.5 3.7-47.1 3.7-70.8 0-23.6-1.2-47.2-3.7-70.7-47-4.9-94.4-4.9-141.5 0z"></path><path class="lineal-stroke" d="M469.1 161.4C435.2 64.7 343.9.1 241.4 0h-.1C108 0 0 108.1 0 241.3v.2c0 133.2 108 241.2 241.2 241.2h.3c60.1 0 118-22.4 162.3-62.9l1.2-1.2.3-.4c.3-.3.5-.7.8-1.1.1-.1.1-.2.2-.3.6-.9 1.1-1.9 1.4-3 0-.1.1-.3.1-.4.1-.4.2-.8.3-1.3 0-.1.1-.3.1-.4.1-.5.2-1.1.2-1.6v-2.2c-.1-.5-.1-.9-.2-1.4v-.3c-.1-.6-.3-1.1-.5-1.7 0-.1-.1-.2-.1-.2-.2-.4-.4-.9-.6-1.3l-.2-.4c-.2-.4-.5-.8-.7-1.2l-.2-.3c-.3-.4-.6-.8-1-1.2l-.1-.1-.3-.3c-.3-.3-.6-.6-1-.9l-.4-.3c-.4-.3-.7-.5-1.1-.8l-.3-.2c-.5-.3-1-.6-1.5-.8h-.1l-1.5-.6-.2-.1c-24.4-7.3-52.9-12.7-83.6-16.1 4.4-18.2 7.7-36.7 10-55.2 21.6-2.6 43.1-6.7 64.1-12.2 10.6 14.4 22.4 27.8 35.4 40 5.7 5.2 14.6 4.9 19.8-.8 5.2-5.7 4.9-14.6-.8-19.8-16.6-15.3-59.7-63.2-59.7-100.8.4-27.7 23.2-49.9 50.9-49.5 27.2.4 49.1 22.3 49.5 49.5 0 16.9-8.7 37.9-25 61-4.5 6.3-3 15.1 3.3 19.6 6.3 4.5 15.1 3 19.6-3.3 19.9-28.3 30.1-54.3 30.1-77.3 0-29.2-16.6-56.2-42.9-69.5zm-167.5 94.4v.5c-.3 14.6-1.1 28.9-2.3 43l-1.7.1c-3.5.3-7 .6-10.6.8l-2.9.2c-4.2.3-8.5.5-12.8.7-.8 0-1.7.1-2.5.1-3.6.1-7.1.3-10.7.4l-3.6.1c-4.4.1-8.7.1-13.1.1-4.8 0-9.6 0-14.4-.1h-.5c-14.6-.3-28.9-1.1-43-2.3-1.2-14-2-28.4-2.3-43v-.5c-.1-4.8-.2-9.6-.2-14.4 0-4.8 0-9.6.2-14.4v-.5c.3-14.6 1.1-28.9 2.3-43 18.8-1.7 38.2-2.5 57.9-2.5 4.3 0 8.6.1 12.9.1l3.6.1c3.9.1 7.7.2 11.6.4 1.3 0 2.5.1 3.8.2 3 .1 6 .3 9 .5 1.8.1 3.5.2 5.2.3 2.9.2 5.8.4 8.8.7l3 .2c1.2 14 2 28.4 2.3 43v.5c.1 4.8.1 9.6.1 14.4s0 9.5-.1 14.3zM278.1 77.6c-12 .7-24.3 1-36.8 1s-24.7-.3-36.8-1c13.1-36.4 27.8-49.5 36.7-49.5 9.1 0 23.8 13.1 36.9 49.5zM119.6 66.2c2-1.4 3.9-2.7 5.9-4l.8-.5c1.9-1.2 3.8-2.4 5.8-3.6l.9-.6c2-1.2 4.1-2.4 6.2-3.5l1.3-.7 6.3-3.3.7-.3c2-1 4-1.9 6.1-2.9l1.1-.5c2.1-1 4.3-1.9 6.5-2.8l1.4-.5c2.2-.9 4.4-1.7 6.7-2.5l.6-.2c2.1-.8 4.3-1.5 6.5-2.2l1.2-.4c2.2-.7 4.5-1.4 6.8-2l1.4-.4c2.3-.6 4.6-1.2 7-1.8l.4-.1 1.4-.3c-6.5 10.6-12.9 24.3-18.7 42.1-19.1-1.9-38-4.8-56.7-8.8l.4-.2zm176.5 88.9c-8-.6-16.1-1.1-24.2-1.5h-.5c-2.9-.1-5.8-.2-8.8-.3l-1.4-.1c-2.7-.1-5.4-.1-8.1-.2h-1.9c-3.3-.1-6.5-.1-9.8-.1-18.5 0-36.9.7-54.7 2.1 2.3-16.8 5.5-33.4 9.6-49.9 14.8 1 29.9 1.5 45.2 1.5s30.4-.5 45.2-1.5c3.9 16.6 7.2 33.2 9.4 50zM307 75.4c-5.9-17.8-12.2-31.5-18.7-42.1l1.4.3.5.1c2.3.5 4.7 1.1 7 1.8l1.4.4c2.3.6 4.5 1.3 6.8 2l1.2.4c2.2.7 4.3 1.4 6.5 2.2l.6.2c2.2.8 4.5 1.7 6.7 2.5l1.4.5c2.2.9 4.3 1.8 6.5 2.8l1 .5c2.1.9 4.1 1.9 6.1 2.9l.7.3c2.1 1 4.2 2.2 6.4 3.3l1.3.7c2.1 1.1 4.1 2.3 6.2 3.5l.9.5c1.9 1.2 3.9 2.4 5.8 3.6l.8.5c2 1.3 4 2.6 5.9 4l.6.4c-19 3.9-38 6.8-57 8.7zM92.2 88.9c22.6 6.2 48.3 10.8 75.7 13.8-7.9 32.7-12.9 70.7-14.5 111v.3c-.1 2.8-.2 5.7-.3 8.6v.6c-.1 2.8-.1 5.5-.2 8.3v1.6c0 2.8 0 5.5-.1 8.3 0 2.8 0 5.5.1 8.3v1.6c0 2.8.1 5.5.2 8.3v.6c.1 2.9.2 5.7.3 8.6v.2c.4 9.2.9 18.2 1.6 27.1-25.9-3.6-49.7-8.8-70.1-15.5C43 267 28.1 251 28.1 241.4c0-57.4 23.1-112.3 64.1-152.5zM33.3 288.3c10.8 6.6 24.8 13 42.9 19 23.7 7.7 51.5 13.7 81.8 17.4 2.3 18.6 5.6 37 10 55.2-27.4 3-53.1 7.7-75.7 13.8-29.4-28.7-49.9-65.3-59-105.4zm323.9 132.2l-.8.5c-1.9 1.2-3.8 2.4-5.7 3.5l-1 .6c-2 1.2-4.1 2.4-6.1 3.5l-1.3.7-6.3 3.3-.8.4c-2 1-4 1.9-6 2.9l-1.1.5c-2.1 1-4.3 1.9-6.5 2.7l-1.4.5c-2.2.9-4.4 1.7-6.7 2.5l-.6.2c-2.1.8-4.3 1.5-6.4 2.2l-1.2.4c-2.2.7-4.5 1.4-6.7 2l-1.4.4c-2.3.6-4.6 1.2-7 1.8l-.5.1-1.4.3c6.5-10.6 12.9-24.4 18.7-42.1 19 1.9 38 4.8 56.7 8.8l-.6.4c-2 1.3-3.9 2.6-5.9 3.9zm-115.8 34.2c-9.1 0-23.7-13.2-36.8-49.5 12.1-.7 24.3-1 36.8-1s24.7.4 36.8 1c-13.2 36.3-27.8 49.4-36.8 49.5zm-47-5.2l-1.4-.3-.5-.1c-2.3-.5-4.6-1.1-7-1.8-.5-.1-1-.2-1.4-.4-2.3-.6-4.5-1.3-6.7-2l-1.2-.4c-2.2-.7-4.3-1.4-6.4-2.2l-.6-.2c-2.2-.8-4.5-1.7-6.7-2.5l-1.4-.5c-2.2-.9-4.3-1.8-6.5-2.7l-1.1-.5c-2-.9-4.1-1.9-6.1-2.9l-.7-.4c-2.1-1.1-4.2-2.1-6.3-3.3l-1.3-.7c-2.1-1.1-4.1-2.3-6.1-3.5l-.9-.6c-1.9-1.1-3.8-2.3-5.7-3.5l-.8-.5c-2-1.3-4-2.6-5.9-4l-.6-.4c18.7-4 37.6-6.9 56.7-8.8 5.8 17.8 12.1 31.6 18.6 42.2zm46.9-73.4c-15.3 0-30.4.5-45.2 1.5-4.1-16.4-7.3-33.1-9.6-49.9 8.9.7 18 1.2 27.1 1.6h.3c2.8.1 5.7.2 8.5.3h.6c2.7.1 5.5.1 8.3.2h1.6c2.8 0 5.5.1 8.3.1 3.4 0 6.8 0 10.2-.1l2.9-.1c2.4 0 4.9-.1 7.3-.2l3.1-.1 7.2-.3 2.8-.1c2.6-.1 5.2-.3 7.9-.4l2.1-.1c3.7-.2 7.4-.5 11.1-.8-2.3 16.8-5.5 33.4-9.6 49.9-14.4-1-29.6-1.5-44.9-1.5zm86.3-80c.7-8.9 1.2-17.9 1.6-27.1v-.2c.1-2.9.2-5.7.3-8.6v-.6c.1-2.7.1-5.5.2-8.3v-1.6c0-2.8.1-5.5.1-8.3s0-5.5-.1-8.3v-1.6c0-2.8-.1-5.5-.2-8.3v-.6c-.1-2.9-.2-5.7-.3-8.6v-.2c-.3-9.2-.9-18.2-1.6-27.1 13.1 1.8 25.8 4 37.6 6.7-6.4 11.6-9.8 24.6-9.8 37.8 0 19.2 7.3 38.8 17.2 56.5-13.8 3.4-29 6.2-45 8.4zm58.2-126.7c-20.1-5.1-40.5-8.9-61-11.4-2.3-18.6-5.6-37.1-10-55.3 27.4-3 53.1-7.7 75.7-13.8 18.8 18.4 34.1 40.1 45 64.1h-1.7c-17.4-.1-34.3 5.7-48 16.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">geolocalization</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/geolocalization.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/geolocalization.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 388.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/gift.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M251.1 258.8l-44.3-22.9c-1.3-.6-2.7-.6-4 0l-44.4 22.9c-2.1 1.1-4.7.3-5.8-1.9-.3-.6-.5-1.3-.5-2v-113l105.4.2v112.8c0 2.4-1.9 4.3-4.3 4.3-.8 0-1.5-.1-2.1-.4z"></path><path class="lineal-stroke" d="M253.1 270.7c-2.5 0-5-.6-7.2-1.8l-41.1-21.2-41.1 21.2c-2.2 1.2-4.7 1.8-7.2 1.8-8.7 0-15.8-7.1-15.8-15.8v-113c0-6.3 5.1-11.5 11.5-11.5l105.3.2c6.3 0 11.4 5.1 11.4 11.5v112.8c0 8.7-7.1 15.8-15.8 15.8zm-48.3-46.8c2.5 0 5 .6 7.2 1.8l34 17.6v-89.6l-82.4-.2v89.8l34-17.6c2.3-1.2 4.7-1.8 7.2-1.8z"></path><path class="lineal-stroke" d="M319.5 388.9H90.1c-29.6 0-53.6-24-53.6-53.6V142.1c0-6.3 5.1-11.5 11.5-11.5h313.8c6.3 0 11.5 5.1 11.5 11.5v25.5c.2 6.3-4.8 11.6-11.1 11.8-6.3.2-11.6-4.8-11.8-11.1v-14.7H59.3v181.7c0 17 13.8 30.7 30.7 30.7h229.5c17 0 30.7-13.8 30.7-30.7V228.8c0-6.3 5.1-11.5 11.5-11.5 6.3 0 11.5 5.1 11.5 11.5v106.4c-.1 29.7-24.1 53.6-53.7 53.7z"></path><path class="lineal-fill" d="M356.5 142.1H53.2c-23 0-41.7-18.7-41.7-41.7 0-23 18.7-41.7 41.7-41.7h303.3c23 0 41.7 18.7 41.7 41.7-.1 23-18.7 41.7-41.7 41.7z"></path><path class="lineal-stroke" d="M356.5 153.5H53.2C23.8 153.5 0 129.7 0 100.4s23.8-53.2 53.2-53.2h303.3c29.4 0 53.1 23.8 53.1 53.2s-23.8 53.1-53.1 53.1zM53.2 70.1c-16.7-.3-30.5 13-30.8 29.7s13 30.5 29.7 30.8h304.4c16.7.3 30.5-13 30.8-29.7.3-16.7-13-30.5-29.7-30.8H53.2z"></path><path class="lineal-fill" d="M203.2 58.7c-5.8-31.3-35.8-52-67.1-46.3-23.5 4.3-42 22.7-46.3 46.3h113.4z"></path><path class="lineal-stroke" d="M203.2 70.1H89.8c-6.3 0-11.5-5.1-11.4-11.5 0-.7.1-1.3.2-2C85.4 19 121.4-5.9 158.9 1c28.3 5.2 50.4 27.3 55.6 55.6 1.1 6.2-3 12.2-9.2 13.3-.7.1-1.4.2-2.1.2zm-97.4-22.9h81.4c-12.1-22.5-40.2-30.9-62.6-18.8-8 4.3-14.5 10.9-18.8 18.8z"></path><path class="lineal-fill" d="M319.8 58.7c-5.8-31.3-35.8-52-67.1-46.3-23.5 4.3-42 22.7-46.3 46.3h113.4z"></path><path class="lineal-stroke" d="M319.8 70.1H206.4c-6.3 0-11.4-5.1-11.4-11.4 0-.7.1-1.4.2-2C201.9 19 237.9-5.9 275.5 1c28.3 5.2 50.4 27.3 55.6 55.6 1.1 6.2-3 12.2-9.3 13.3-.6.1-1.3.2-2 .2zm-97.4-22.9h81.4c-12.1-22.5-40.2-30.9-62.6-18.8-8 4.3-14.5 10.9-18.8 18.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 388.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/gift.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M251.1 258.8l-44.3-22.9c-1.3-.6-2.7-.6-4 0l-44.4 22.9c-2.1 1.1-4.7.3-5.8-1.9-.3-.6-.5-1.3-.5-2v-113l105.4.2v112.8c0 2.4-1.9 4.3-4.3 4.3-.8 0-1.5-.1-2.1-.4z"></path><path class="lineal-stroke" d="M253.1 270.7c-2.5 0-5-.6-7.2-1.8l-41.1-21.2-41.1 21.2c-2.2 1.2-4.7 1.8-7.2 1.8-8.7 0-15.8-7.1-15.8-15.8v-113c0-6.3 5.1-11.5 11.5-11.5l105.3.2c6.3 0 11.4 5.1 11.4 11.5v112.8c0 8.7-7.1 15.8-15.8 15.8zm-48.3-46.8c2.5 0 5 .6 7.2 1.8l34 17.6v-89.6l-82.4-.2v89.8l34-17.6c2.3-1.2 4.7-1.8 7.2-1.8z"></path><path class="lineal-stroke" d="M319.5 388.9H90.1c-29.6 0-53.6-24-53.6-53.6V142.1c0-6.3 5.1-11.5 11.5-11.5h313.8c6.3 0 11.5 5.1 11.5 11.5v25.5c.2 6.3-4.8 11.6-11.1 11.8-6.3.2-11.6-4.8-11.8-11.1v-14.7H59.3v181.7c0 17 13.8 30.7 30.7 30.7h229.5c17 0 30.7-13.8 30.7-30.7V228.8c0-6.3 5.1-11.5 11.5-11.5 6.3 0 11.5 5.1 11.5 11.5v106.4c-.1 29.7-24.1 53.6-53.7 53.7z"></path><path class="lineal-fill" d="M356.5 142.1H53.2c-23 0-41.7-18.7-41.7-41.7 0-23 18.7-41.7 41.7-41.7h303.3c23 0 41.7 18.7 41.7 41.7-.1 23-18.7 41.7-41.7 41.7z"></path><path class="lineal-stroke" d="M356.5 153.5H53.2C23.8 153.5 0 129.7 0 100.4s23.8-53.2 53.2-53.2h303.3c29.4 0 53.1 23.8 53.1 53.2s-23.8 53.1-53.1 53.1zM53.2 70.1c-16.7-.3-30.5 13-30.8 29.7s13 30.5 29.7 30.8h304.4c16.7.3 30.5-13 30.8-29.7.3-16.7-13-30.5-29.7-30.8H53.2z"></path><path class="lineal-fill" d="M203.2 58.7c-5.8-31.3-35.8-52-67.1-46.3-23.5 4.3-42 22.7-46.3 46.3h113.4z"></path><path class="lineal-stroke" d="M203.2 70.1H89.8c-6.3 0-11.5-5.1-11.4-11.5 0-.7.1-1.3.2-2C85.4 19 121.4-5.9 158.9 1c28.3 5.2 50.4 27.3 55.6 55.6 1.1 6.2-3 12.2-9.2 13.3-.7.1-1.4.2-2.1.2zm-97.4-22.9h81.4c-12.1-22.5-40.2-30.9-62.6-18.8-8 4.3-14.5 10.9-18.8 18.8z"></path><path class="lineal-fill" d="M319.8 58.7c-5.8-31.3-35.8-52-67.1-46.3-23.5 4.3-42 22.7-46.3 46.3h113.4z"></path><path class="lineal-stroke" d="M319.8 70.1H206.4c-6.3 0-11.4-5.1-11.4-11.4 0-.7.1-1.4.2-2C201.9 19 237.9-5.9 275.5 1c28.3 5.2 50.4 27.3 55.6 55.6 1.1 6.2-3 12.2-9.3 13.3-.6.1-1.3.2-2 .2zm-97.4-22.9h81.4c-12.1-22.5-40.2-30.9-62.6-18.8-8 4.3-14.5 10.9-18.8 18.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">gift</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/gift.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/gift.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 482.17 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/group-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M50.74 171.2s48.62-21.54 111.2-28.37c10-1.1 51.5-30.67 51.76-30.86 27.24-20 48.4 59.23 48.4 59.23.25-1.4.49-2.84.72-4.31.11-.66.21-1.32.31-2 2.37-15.38 11.8-34 11.73-49.6 0-10.17-.88-19-2.87-24.88-18.09-53.14-61.59-35.63-61.59-35.63S180.07 14 157 15.29h-.77v.1a16.67 16.67 0 00-6.41 1.92c-59.56 32-67.45 28-80.81 32.65-32.4 11.25-33.25 8.24-29.17 33.21 6.84 41.69 9.63 72.07 10.9 88.03z"></path><path class="lineal-fill" d="M282.31 228.58s40-17.75 91.59-23.37c8.26-.9 42.42-25.26 42.64-25.42 22.44-16.47 39.87 48.79 39.87 48.79.2-1.15.4-2.34.6-3.55.08-.54.17-1.09.25-1.64 1.95-12.67 9.72-28 9.66-40.86 0-8.37-.73-15.68-2.36-20.49-14.91-43.78-50.74-29.35-50.74-29.35s-25-33.57-44-32.54h-.63v.08a13.78 13.78 0 00-5.28 1.58c-49.06 26.37-55.56 23.07-66.57 26.9-26.69 9.27-27.39 6.79-24 27.36 5.66 34.34 7.92 59.37 8.97 72.51z"></path><path class="lineal-stroke" d="M479 157.12c-12.9-37.87-40.5-42-51.77-42a57.15 57.15 0 00-7.5.5c-10.47-12.24-29.54-30.79-49-30.79h-1.6a15.19 15.19 0 00-3.47.43 28.87 28.87 0 00-8.93 3c-35.82 19.26-47.42 21.8-55.09 23.47a75.28 75.28 0 00-9.25 2.46l-2.26.78c-.07-12.81-1.27-22.47-3.68-29.55C272 43.1 242.79 36.77 226.67 36.77a66.24 66.24 0 00-10.45.85C204.64 23.91 181.13 0 158.06 0h-1.95a15.32 15.32 0 00-3.54.45 31.84 31.84 0 00-9.95 3.38c-43.89 23.59-58.24 26.73-67.74 28.8A90.79 90.79 0 0064 35.51c-3.54 1.23-6.7 2.29-9.51 3.23-13.83 4.63-22.19 7.43-27.55 15.58-5.8 8.82-4.26 18.24-2.13 31.27 4.91 30 8.51 59.14 10.7 86.53V191a120.49 120.49 0 0031.14 80.92C26.37 291.62 0 334.65 0 384.81v111.94A15.25 15.25 0 0015.25 512h362.24a15.26 15.26 0 000-30.51H268.33v-76.95c0-34.81 19.35-62.88 48.75-71.73a102.29 102.29 0 00154.69-87.91v-15.7c.1-.59.2-1.16.3-1.76l.27-1.73a107 107 0 013.91-14.47c2.8-8.85 6-18.87 5.92-28.78-.04-10.92-1.08-19.2-3.17-25.34zm-184.76-11.27c2.41-.81 5.11-1.71 8.13-2.76a50.32 50.32 0 015.75-1.48c9.87-2.15 23.38-5.1 62.73-26.23 5.81.2 20.67 13 30.74 26.42a14.79 14.79 0 0017.83 5.08 25.62 25.62 0 017.81-1.21c3.86 0 15.64 0 22.89 21.29.31.91 1.25 4.3 1.49 12.33-6.27-8.9-15.4-17.42-27.73-17.42a27.66 27.66 0 00-16.27 5.56c-11.52 8.26-30.5 20.64-36.19 22.71a365.87 365.87 0 00-75.77 17.09c-1.82-17.33-4.25-35.3-7.25-53.65-.28-1.69-.61-3.7-.85-5.44 1.96-.71 4.45-1.53 6.69-2.29zm-230.35 1.84c-2.23-21.61-5.22-44.06-9-67-.48-3-1.09-6.67-1.37-9.27 2.62-1.05 6.68-2.41 10.66-3.74 2.9-1 6.17-2.06 9.83-3.34a63.86 63.86 0 017.36-1.89c11.82-2.58 28-6.11 75.67-31.73a1.44 1.44 0 01.65-.17h.35c8.93 0 28.31 17.6 40.11 33.38A14.86 14.86 0 00216 69a34.36 34.36 0 0110.65-1.69c14.35 0 24.45 9.18 30.88 28.06.6 1.76 2 7.23 2.06 20a37.08 37.08 0 01-.67 6.58c-10.71-19.12-22.66-28.46-36.33-28.46a29.94 29.94 0 00-17.86 6.13c-14.58 10.46-38.48 26-45.08 28.12a441.11 441.11 0 00-94.85 21.72 14.78 14.78 0 00-.91-1.77zM66 191v-9.5a411.41 411.41 0 0197.59-23.5c15.35-1.68 56.62-31.88 59.08-33.68 1.91 1.31 7.75 6.52 15.45 24.47a226.19 226.19 0 018.86 25V191a90.48 90.48 0 01-181 0zm171.8 213.52v76.95H30.51v-96.66c0-44.31 25-79.93 62.91-90.6A120.86 120.86 0 00267.07 240v4.88a101.88 101.88 0 0024.06 65.83c-32.34 17.29-53.31 52.75-53.31 93.83zm131.61-87.79a71.93 71.93 0 01-71.85-71.85v-6a336.6 336.6 0 0178-18.56c12-1.31 40.95-21.72 48.32-27.05 5.13 5.07 12.91 21.8 17.39 37.74v13.89a71.93 71.93 0 01-71.84 71.85z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 482.17 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/group-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M50.74 171.2s48.62-21.54 111.2-28.37c10-1.1 51.5-30.67 51.76-30.86 27.24-20 48.4 59.23 48.4 59.23.25-1.4.49-2.84.72-4.31.11-.66.21-1.32.31-2 2.37-15.38 11.8-34 11.73-49.6 0-10.17-.88-19-2.87-24.88-18.09-53.14-61.59-35.63-61.59-35.63S180.07 14 157 15.29h-.77v.1a16.67 16.67 0 00-6.41 1.92c-59.56 32-67.45 28-80.81 32.65-32.4 11.25-33.25 8.24-29.17 33.21 6.84 41.69 9.63 72.07 10.9 88.03z"></path><path class="lineal-fill" d="M282.31 228.58s40-17.75 91.59-23.37c8.26-.9 42.42-25.26 42.64-25.42 22.44-16.47 39.87 48.79 39.87 48.79.2-1.15.4-2.34.6-3.55.08-.54.17-1.09.25-1.64 1.95-12.67 9.72-28 9.66-40.86 0-8.37-.73-15.68-2.36-20.49-14.91-43.78-50.74-29.35-50.74-29.35s-25-33.57-44-32.54h-.63v.08a13.78 13.78 0 00-5.28 1.58c-49.06 26.37-55.56 23.07-66.57 26.9-26.69 9.27-27.39 6.79-24 27.36 5.66 34.34 7.92 59.37 8.97 72.51z"></path><path class="lineal-stroke" d="M479 157.12c-12.9-37.87-40.5-42-51.77-42a57.15 57.15 0 00-7.5.5c-10.47-12.24-29.54-30.79-49-30.79h-1.6a15.19 15.19 0 00-3.47.43 28.87 28.87 0 00-8.93 3c-35.82 19.26-47.42 21.8-55.09 23.47a75.28 75.28 0 00-9.25 2.46l-2.26.78c-.07-12.81-1.27-22.47-3.68-29.55C272 43.1 242.79 36.77 226.67 36.77a66.24 66.24 0 00-10.45.85C204.64 23.91 181.13 0 158.06 0h-1.95a15.32 15.32 0 00-3.54.45 31.84 31.84 0 00-9.95 3.38c-43.89 23.59-58.24 26.73-67.74 28.8A90.79 90.79 0 0064 35.51c-3.54 1.23-6.7 2.29-9.51 3.23-13.83 4.63-22.19 7.43-27.55 15.58-5.8 8.82-4.26 18.24-2.13 31.27 4.91 30 8.51 59.14 10.7 86.53V191a120.49 120.49 0 0031.14 80.92C26.37 291.62 0 334.65 0 384.81v111.94A15.25 15.25 0 0015.25 512h362.24a15.26 15.26 0 000-30.51H268.33v-76.95c0-34.81 19.35-62.88 48.75-71.73a102.29 102.29 0 00154.69-87.91v-15.7c.1-.59.2-1.16.3-1.76l.27-1.73a107 107 0 013.91-14.47c2.8-8.85 6-18.87 5.92-28.78-.04-10.92-1.08-19.2-3.17-25.34zm-184.76-11.27c2.41-.81 5.11-1.71 8.13-2.76a50.32 50.32 0 015.75-1.48c9.87-2.15 23.38-5.1 62.73-26.23 5.81.2 20.67 13 30.74 26.42a14.79 14.79 0 0017.83 5.08 25.62 25.62 0 017.81-1.21c3.86 0 15.64 0 22.89 21.29.31.91 1.25 4.3 1.49 12.33-6.27-8.9-15.4-17.42-27.73-17.42a27.66 27.66 0 00-16.27 5.56c-11.52 8.26-30.5 20.64-36.19 22.71a365.87 365.87 0 00-75.77 17.09c-1.82-17.33-4.25-35.3-7.25-53.65-.28-1.69-.61-3.7-.85-5.44 1.96-.71 4.45-1.53 6.69-2.29zm-230.35 1.84c-2.23-21.61-5.22-44.06-9-67-.48-3-1.09-6.67-1.37-9.27 2.62-1.05 6.68-2.41 10.66-3.74 2.9-1 6.17-2.06 9.83-3.34a63.86 63.86 0 017.36-1.89c11.82-2.58 28-6.11 75.67-31.73a1.44 1.44 0 01.65-.17h.35c8.93 0 28.31 17.6 40.11 33.38A14.86 14.86 0 00216 69a34.36 34.36 0 0110.65-1.69c14.35 0 24.45 9.18 30.88 28.06.6 1.76 2 7.23 2.06 20a37.08 37.08 0 01-.67 6.58c-10.71-19.12-22.66-28.46-36.33-28.46a29.94 29.94 0 00-17.86 6.13c-14.58 10.46-38.48 26-45.08 28.12a441.11 441.11 0 00-94.85 21.72 14.78 14.78 0 00-.91-1.77zM66 191v-9.5a411.41 411.41 0 0197.59-23.5c15.35-1.68 56.62-31.88 59.08-33.68 1.91 1.31 7.75 6.52 15.45 24.47a226.19 226.19 0 018.86 25V191a90.48 90.48 0 01-181 0zm171.8 213.52v76.95H30.51v-96.66c0-44.31 25-79.93 62.91-90.6A120.86 120.86 0 00267.07 240v4.88a101.88 101.88 0 0024.06 65.83c-32.34 17.29-53.31 52.75-53.31 93.83zm131.61-87.79a71.93 71.93 0 01-71.85-71.85v-6a336.6 336.6 0 0178-18.56c12-1.31 40.95-21.72 48.32-27.05 5.13 5.07 12.91 21.8 17.39 37.74v13.89a71.93 71.93 0 01-71.84 71.85z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">group-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/group-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/group-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 377.43" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/growth.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M352.44 377.43h-51.26A18.49 18.49 0 01282.72 359V121.2H262.5a18.47 18.47 0 01-14.67-29.68l64.3-84.26a18.46 18.46 0 0129.36 0l64.3 84.25a18.47 18.47 0 01-14.67 29.68h-32a11.76 11.76 0 110-23.51h21.78l-54.09-70.9-54.12 70.91h21.78a11.76 11.76 0 0111.76 11.75v244.48h41.16V163a11.76 11.76 0 0123.51 0v196a18.49 18.49 0 01-18.46 18.47z"></path><path class="lineal-fill" d="M152.33 157.16V359a6.71 6.71 0 006.72 6.71h51.25A6.71 6.71 0 00217 359V157.16a6.72 6.72 0 00-6.71-6.72h-51.24a6.72 6.72 0 00-6.72 6.72z"></path><path class="lineal-stroke" d="M210.3 377.43H159A18.49 18.49 0 01140.58 359V157.16A18.48 18.48 0 01159 138.69h51.3a18.48 18.48 0 0118.46 18.47V359a18.49 18.49 0 01-18.46 18.47zm-46.21-23.51h41.16V162.2h-41.16zm-94.38 23.51H18.46A18.49 18.49 0 010 359V243a18.49 18.49 0 0118.46-18.46h51.25a11.76 11.76 0 110 23.51h-46.2v105.87h41.17v-61a11.75 11.75 0 1123.5 0v66a18.49 18.49 0 01-18.47 18.47z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 377.43" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/growth.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M352.44 377.43h-51.26A18.49 18.49 0 01282.72 359V121.2H262.5a18.47 18.47 0 01-14.67-29.68l64.3-84.26a18.46 18.46 0 0129.36 0l64.3 84.25a18.47 18.47 0 01-14.67 29.68h-32a11.76 11.76 0 110-23.51h21.78l-54.09-70.9-54.12 70.91h21.78a11.76 11.76 0 0111.76 11.75v244.48h41.16V163a11.76 11.76 0 0123.51 0v196a18.49 18.49 0 01-18.46 18.47z"></path><path class="lineal-fill" d="M152.33 157.16V359a6.71 6.71 0 006.72 6.71h51.25A6.71 6.71 0 00217 359V157.16a6.72 6.72 0 00-6.71-6.72h-51.24a6.72 6.72 0 00-6.72 6.72z"></path><path class="lineal-stroke" d="M210.3 377.43H159A18.49 18.49 0 01140.58 359V157.16A18.48 18.48 0 01159 138.69h51.3a18.48 18.48 0 0118.46 18.47V359a18.49 18.49 0 01-18.46 18.47zm-46.21-23.51h41.16V162.2h-41.16zm-94.38 23.51H18.46A18.49 18.49 0 010 359V243a18.49 18.49 0 0118.46-18.46h51.25a11.76 11.76 0 110 23.51h-46.2v105.87h41.17v-61a11.75 11.75 0 1123.5 0v66a18.49 18.49 0 01-18.47 18.47z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">growth</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/growth.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/growth.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 390.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/handshake.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M508.4 133.5L378.5 3.7c-4.9-4.9-12.8-4.9-17.6 0l-73.1 73.1-14.4-14.4c-4.9-4.9-12.8-4.9-17.6 0l-22.9 22.9-81.8-81.6c-4.9-4.9-12.8-4.9-17.6 0L3.7 133.5c-4.9 4.9-4.9 12.8 0 17.6L85.6 233c4.9 4.9 12.8 4.9 17.6 0l52.1-52.1 26.5 26.5c.3.3.6.6 1 .9 5 4 12.2 3.7 16.7-.9L256 151l120.7 120.6-13 13-103.6-103.4c-4.9-4.9-12.8-4.9-17.6 0-.3.3-.6.6-.9 1-4 5-3.7 12.2.9 16.7l123.8 123.8-13 13-123.8-123.9c-5-4.7-12.9-4.6-17.6.4-4.6 4.8-4.6 12.4 0 17.2L315.3 333l-13 13-7.7-7.7-95.9-95.8c-4.5-4.5-11.7-4.9-16.7-.9-.4.3-.7.5-1 .9-1.2 1.2-2.1 2.6-2.7 4.1-.3.7-.5 1.5-.7 2.3-.1.4-.1.8-.2 1.2-.4 3.7 1 7.4 3.6 10l43.5 43.5 43.5 43.5-13 13-115-115c-4.9-4.9-12.8-4.9-17.6 0-4.9 4.9-4.9 12.8 0 17.6l123.8 123.9c4.9 4.9 12.8 4.9 17.6 0l21.9-21.9 7.7 7.7c4.8 4.9 12.7 4.9 17.6 0l21.9-21.9 11.5 11.5c4.9 4.9 12.8 4.9 17.6 0l30.7-30.7c4.9-4.9 4.9-12.8 0-17.6l-11.5-11.5 21.9-21.9c4.9-4.9 4.9-12.8 0-17.6L264.8 124.5c-4.9-4.9-12.8-4.9-17.6 0l-56.6 56.6-9.2-9.2 83.1-83.1 14.4 14.4 3.1 3.2.4.4 126.3 126.3c4.9 4.9 12.8 4.9 17.6 0l81.9-81.9c5-4.9 5-12.8.2-17.7z"></path><path class="lineal-fill" d="M30.106 142.324L142.323 30.107 206.6 94.382 94.382 206.6zm275.29-47.939l64.276-64.276 112.216 112.217-64.275 64.276z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 390.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/handshake.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M508.4 133.5L378.5 3.7c-4.9-4.9-12.8-4.9-17.6 0l-73.1 73.1-14.4-14.4c-4.9-4.9-12.8-4.9-17.6 0l-22.9 22.9-81.8-81.6c-4.9-4.9-12.8-4.9-17.6 0L3.7 133.5c-4.9 4.9-4.9 12.8 0 17.6L85.6 233c4.9 4.9 12.8 4.9 17.6 0l52.1-52.1 26.5 26.5c.3.3.6.6 1 .9 5 4 12.2 3.7 16.7-.9L256 151l120.7 120.6-13 13-103.6-103.4c-4.9-4.9-12.8-4.9-17.6 0-.3.3-.6.6-.9 1-4 5-3.7 12.2.9 16.7l123.8 123.8-13 13-123.8-123.9c-5-4.7-12.9-4.6-17.6.4-4.6 4.8-4.6 12.4 0 17.2L315.3 333l-13 13-7.7-7.7-95.9-95.8c-4.5-4.5-11.7-4.9-16.7-.9-.4.3-.7.5-1 .9-1.2 1.2-2.1 2.6-2.7 4.1-.3.7-.5 1.5-.7 2.3-.1.4-.1.8-.2 1.2-.4 3.7 1 7.4 3.6 10l43.5 43.5 43.5 43.5-13 13-115-115c-4.9-4.9-12.8-4.9-17.6 0-4.9 4.9-4.9 12.8 0 17.6l123.8 123.9c4.9 4.9 12.8 4.9 17.6 0l21.9-21.9 7.7 7.7c4.8 4.9 12.7 4.9 17.6 0l21.9-21.9 11.5 11.5c4.9 4.9 12.8 4.9 17.6 0l30.7-30.7c4.9-4.9 4.9-12.8 0-17.6l-11.5-11.5 21.9-21.9c4.9-4.9 4.9-12.8 0-17.6L264.8 124.5c-4.9-4.9-12.8-4.9-17.6 0l-56.6 56.6-9.2-9.2 83.1-83.1 14.4 14.4 3.1 3.2.4.4 126.3 126.3c4.9 4.9 12.8 4.9 17.6 0l81.9-81.9c5-4.9 5-12.8.2-17.7z"></path><path class="lineal-fill" d="M30.106 142.324L142.323 30.107 206.6 94.382 94.382 206.6zm275.29-47.939l64.276-64.276 112.216 112.217-64.275 64.276z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">handshake</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/handshake.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/handshake.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 385.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/headphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M204.8 363.2c-6.4-.4-11.2-5.8-10.8-12.2.3-5.8 5-10.5 10.8-10.8 36.3 0 71-14.5 96.5-40.3 4.5-4.5 11.8-4.5 16.3 0s4.5 11.8 0 16.3c-29.7 30.1-70.4 47.1-112.8 47zm147.7-147.7c-6.3 0-11.5-5.1-11.5-11.5v-44.8C341 84.1 279.9 23 204.8 23S68.6 84.1 68.6 159.2c-.4 6.4-5.8 11.2-12.2 10.8-5.8-.3-10.5-5-10.8-10.8C45.6 71.4 117 0 204.8 0S364 71.4 364 159.2V204c0 6.4-5.2 11.5-11.5 11.5z"></path><path class="lineal-fill" d="M213.5 374h-17.4c-12.2 0-22.1-9.9-22.1-22.1 0-12.2 9.9-22 22.1-22.1h17.4c12.2 0 22.1 9.9 22.1 22.1s-9.9 22.1-22.1 22.1z"></path><path class="lineal-stroke" d="M213.5 385.6h-17.4c-18.5 0-33.6-15-33.6-33.6 0-18.5 15-33.6 33.6-33.6h17.4c18.5 0 33.6 15 33.6 33.6 0 18.5-15.1 33.6-33.6 33.6zm-17.4-44.1c-5.8 0-10.5 4.7-10.6 10.5 0 5.8 4.7 10.5 10.5 10.6h17.4c5.8 0 10.5-4.7 10.6-10.5 0-5.8-4.7-10.5-10.5-10.6h-17.4z"></path><path class="lineal-fill" d="M76.3 242.9h-35c-16.5 0-29.8-13.4-29.8-29.8v-33.2c0-16.5 13.4-29.8 29.8-29.8h35v92.8z"></path><path class="lineal-stroke" d="M76.3 254.4h-35C18.5 254.4 0 235.9 0 213.1v-33.2c0-22.8 18.5-41.3 41.3-41.3h35c6.4 0 11.5 5.2 11.5 11.5v92.8c.1 6.3-5.1 11.5-11.5 11.5zm-35-92.8c-10.1 0-18.3 8.2-18.3 18.3V213c0 10.1 8.2 18.3 18.3 18.3h23.5v-69.8l-23.5.1z"></path><path class="lineal-fill" d="M82.7 257.8c-13.3 0-24.1-10.8-24.1-24.1v-74.4c0-13.3 10.8-24.1 24.1-24.1s24.1 10.8 24.1 24.1v74.4c0 13.3-10.8 24.1-24.1 24.1z"></path><path class="lineal-stroke" d="M82.7 269.3c-19.7 0-35.6-16-35.7-35.6v-74.4c-.3-19.7 15.4-35.9 35-36.2s35.9 15.4 36.2 35v75.6c.1 19.7-15.9 35.6-35.5 35.6zm0-122.7c-7 0-12.6 5.7-12.6 12.6v74.4c0 7 5.6 12.6 12.6 12.6s12.6-5.6 12.6-12.6v-74.4c0-6.9-5.7-12.5-12.6-12.6z"></path><path class="lineal-fill" d="M333.2 242.9h35c16.5 0 29.8-13.4 29.8-29.8v-33.2c0-16.5-13.4-29.8-29.8-29.8h-35v92.8z"></path><path class="lineal-stroke" d="M368.3 254.4h-35c-6.4 0-11.5-5.2-11.5-11.5v-92.8c0-6.4 5.2-11.5 11.5-11.5h35c22.8 0 41.3 18.5 41.3 41.3V213c0 22.9-18.5 41.4-41.3 41.4zm-23.5-23h23.5c10.1 0 18.3-8.2 18.3-18.3v-33.2c0-10.1-8.2-18.3-18.3-18.3h-23.5v69.8z"></path><path class="lineal-fill" d="M326.9 257.8c13.3 0 24.1-10.8 24.1-24.1v-74.4c0-13.3-10.8-24.1-24.1-24.1s-24.1 10.8-24.1 24.1v74.4c0 13.3 10.8 24.1 24.1 24.1z"></path><path class="lineal-stroke" d="M326.9 269.3c-19.7 0-35.6-16-35.6-35.6v-74.4c0-19.7 16-35.6 35.6-35.6 19.7 0 35.6 16 35.6 35.6v74.4c0 19.7-15.9 35.6-35.6 35.6zm0-122.7c-7 0-12.6 5.7-12.6 12.6v74.4c0 7 5.6 12.6 12.6 12.6s12.6-5.6 12.6-12.6v-74.4c0-6.9-5.6-12.5-12.6-12.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 385.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/headphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M204.8 363.2c-6.4-.4-11.2-5.8-10.8-12.2.3-5.8 5-10.5 10.8-10.8 36.3 0 71-14.5 96.5-40.3 4.5-4.5 11.8-4.5 16.3 0s4.5 11.8 0 16.3c-29.7 30.1-70.4 47.1-112.8 47zm147.7-147.7c-6.3 0-11.5-5.1-11.5-11.5v-44.8C341 84.1 279.9 23 204.8 23S68.6 84.1 68.6 159.2c-.4 6.4-5.8 11.2-12.2 10.8-5.8-.3-10.5-5-10.8-10.8C45.6 71.4 117 0 204.8 0S364 71.4 364 159.2V204c0 6.4-5.2 11.5-11.5 11.5z"></path><path class="lineal-fill" d="M213.5 374h-17.4c-12.2 0-22.1-9.9-22.1-22.1 0-12.2 9.9-22 22.1-22.1h17.4c12.2 0 22.1 9.9 22.1 22.1s-9.9 22.1-22.1 22.1z"></path><path class="lineal-stroke" d="M213.5 385.6h-17.4c-18.5 0-33.6-15-33.6-33.6 0-18.5 15-33.6 33.6-33.6h17.4c18.5 0 33.6 15 33.6 33.6 0 18.5-15.1 33.6-33.6 33.6zm-17.4-44.1c-5.8 0-10.5 4.7-10.6 10.5 0 5.8 4.7 10.5 10.5 10.6h17.4c5.8 0 10.5-4.7 10.6-10.5 0-5.8-4.7-10.5-10.5-10.6h-17.4z"></path><path class="lineal-fill" d="M76.3 242.9h-35c-16.5 0-29.8-13.4-29.8-29.8v-33.2c0-16.5 13.4-29.8 29.8-29.8h35v92.8z"></path><path class="lineal-stroke" d="M76.3 254.4h-35C18.5 254.4 0 235.9 0 213.1v-33.2c0-22.8 18.5-41.3 41.3-41.3h35c6.4 0 11.5 5.2 11.5 11.5v92.8c.1 6.3-5.1 11.5-11.5 11.5zm-35-92.8c-10.1 0-18.3 8.2-18.3 18.3V213c0 10.1 8.2 18.3 18.3 18.3h23.5v-69.8l-23.5.1z"></path><path class="lineal-fill" d="M82.7 257.8c-13.3 0-24.1-10.8-24.1-24.1v-74.4c0-13.3 10.8-24.1 24.1-24.1s24.1 10.8 24.1 24.1v74.4c0 13.3-10.8 24.1-24.1 24.1z"></path><path class="lineal-stroke" d="M82.7 269.3c-19.7 0-35.6-16-35.7-35.6v-74.4c-.3-19.7 15.4-35.9 35-36.2s35.9 15.4 36.2 35v75.6c.1 19.7-15.9 35.6-35.5 35.6zm0-122.7c-7 0-12.6 5.7-12.6 12.6v74.4c0 7 5.6 12.6 12.6 12.6s12.6-5.6 12.6-12.6v-74.4c0-6.9-5.7-12.5-12.6-12.6z"></path><path class="lineal-fill" d="M333.2 242.9h35c16.5 0 29.8-13.4 29.8-29.8v-33.2c0-16.5-13.4-29.8-29.8-29.8h-35v92.8z"></path><path class="lineal-stroke" d="M368.3 254.4h-35c-6.4 0-11.5-5.2-11.5-11.5v-92.8c0-6.4 5.2-11.5 11.5-11.5h35c22.8 0 41.3 18.5 41.3 41.3V213c0 22.9-18.5 41.4-41.3 41.4zm-23.5-23h23.5c10.1 0 18.3-8.2 18.3-18.3v-33.2c0-10.1-8.2-18.3-18.3-18.3h-23.5v69.8z"></path><path class="lineal-fill" d="M326.9 257.8c13.3 0 24.1-10.8 24.1-24.1v-74.4c0-13.3-10.8-24.1-24.1-24.1s-24.1 10.8-24.1 24.1v74.4c0 13.3 10.8 24.1 24.1 24.1z"></path><path class="lineal-stroke" d="M326.9 269.3c-19.7 0-35.6-16-35.6-35.6v-74.4c0-19.7 16-35.6 35.6-35.6 19.7 0 35.6 16 35.6 35.6v74.4c0 19.7-15.9 35.6-35.6 35.6zm0-122.7c-7 0-12.6 5.7-12.6 12.6v74.4c0 7 5.6 12.6 12.6 12.6s12.6-5.6 12.6-12.6v-74.4c0-6.9-5.6-12.5-12.6-12.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">headphone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/headphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/headphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/headphone-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M289.9 480.5h-43.7c-8 0-14.5-6.5-14.5-14.5s6.5-14.5 14.5-14.5h43.7c65.2 0 118.1-52.9 118.1-118.1 0-8 6.5-14.5 14.5-14.5s14.5 6.5 14.5 14.5c.1 81.3-65.8 147.1-147.1 147.1zM57.7 369.9c-8 0-14.5-6.5-14.5-14.5V147.1C43.2 66 109.2 0 190.3 0h99.6C343 .1 392 28.7 418.2 75c3.9 7 1.5 15.8-5.5 19.8-7 3.9-15.8 1.5-19.8-5.5-21-37.2-60.3-60.2-103-60.2h-99.6c-65.2 0-118.1 52.8-118.2 118v208.3c0 8-6.4 14.5-14.4 14.5z"></path><path class="lineal-fill" d="M394.2 370.9c15.3 0 27.6-12.4 27.6-27.6V354h8.6c19.5 0 35.3-15.8 35.3-35.3v-76c0-19.5-15.8-35.3-35.3-35.3h-8.6v10.7c0-15.3-12.4-27.6-27.6-27.6-15.3 0-27.6 12.4-27.6 27.6v125.1c0 15.3 12.3 27.7 27.6 27.7z"></path><path class="lineal-stroke" d="M394.2 385.4c-23.3 0-42.1-18.9-42.1-42.1V218.2c0-23.3 18.9-42.1 42.2-42.1 13.3 0 25.8 6.3 33.7 16.9h2.5c27.5 0 49.8 22.3 49.8 49.8v76c0 27.5-22.3 49.8-49.8 49.8H428c-8 10.6-20.5 16.8-33.8 16.8zm0-180.4c-7.3 0-13.1 5.9-13.1 13.1v125.1c0 7.3 5.9 13.1 13.1 13.1 7.3 0 13.1-5.9 13.1-13.1 0-8 6.5-14.5 14.5-14.5 6.3 0 11.9 4.1 13.8 10.1 9.2-2.4 15.5-10.7 15.6-20.1v-76c0-9.5-6.4-17.7-15.6-20.1-2.4 7.6-10.6 11.8-18.2 9.4-6-1.9-10.1-7.5-10.1-13.8 0-7.3-5.9-13.2-13.1-13.2z"></path><path class="lineal-fill" d="M86 370.9c-15.3 0-27.6-12.4-27.6-27.6V354h-8.6c-19.5 0-35.3-15.8-35.3-35.3v-76c0-19.5 15.8-35.3 35.3-35.3h8.6v10.7c0-15.2 12.4-27.6 27.6-27.6 15.3 0 27.6 12.4 27.6 27.6v125.1c0 15.3-12.3 27.7-27.6 27.7z"></path><path class="lineal-stroke" d="M86 385.4c-13.3 0-25.8-6.3-33.7-16.9h-2.5C22.3 368.4 0 346.2 0 318.7v-76C.1 215.2 22.3 193 49.8 193h2.5c13.9-18.6 40.3-22.5 58.9-8.6 10.7 8 16.9 20.5 16.9 33.8v125c0 23.3-18.8 42.2-42.1 42.2zm-13.1-42.2c-.2 7.3 5.5 13.3 12.8 13.5 7.3.2 13.3-5.5 13.5-12.8V218.2c.2-7.3-5.5-13.3-12.8-13.5-7.3-.2-13.3 5.5-13.5 12.8v.7c0 8-6.5 14.5-14.5 14.5-6.3 0-11.9-4.1-13.8-10.1C35.4 225 29 233.3 29 242.7v76c0 9.4 6.4 17.7 15.6 20.1 2.4-7.6 10.6-11.8 18.2-9.4 6 1.9 10.1 7.5 10.1 13.8z"></path><circle class="lineal-fill" cx="255.8" cy="461.3" r="36.2"></circle><path class="lineal-stroke" d="M255.8 512c-28 0-50.7-22.7-50.7-50.7 0-28 22.7-50.7 50.7-50.7s50.7 22.7 50.7 50.7c-.1 28-22.8 50.7-50.7 50.7zm0-72.4c-12 0-21.7 9.7-21.7 21.7s9.7 21.7 21.7 21.7 21.7-9.7 21.7-21.7c-.1-11.9-9.8-21.6-21.7-21.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 480.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/headphone-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M289.9 480.5h-43.7c-8 0-14.5-6.5-14.5-14.5s6.5-14.5 14.5-14.5h43.7c65.2 0 118.1-52.9 118.1-118.1 0-8 6.5-14.5 14.5-14.5s14.5 6.5 14.5 14.5c.1 81.3-65.8 147.1-147.1 147.1zM57.7 369.9c-8 0-14.5-6.5-14.5-14.5V147.1C43.2 66 109.2 0 190.3 0h99.6C343 .1 392 28.7 418.2 75c3.9 7 1.5 15.8-5.5 19.8-7 3.9-15.8 1.5-19.8-5.5-21-37.2-60.3-60.2-103-60.2h-99.6c-65.2 0-118.1 52.8-118.2 118v208.3c0 8-6.4 14.5-14.4 14.5z"></path><path class="lineal-fill" d="M394.2 370.9c15.3 0 27.6-12.4 27.6-27.6V354h8.6c19.5 0 35.3-15.8 35.3-35.3v-76c0-19.5-15.8-35.3-35.3-35.3h-8.6v10.7c0-15.3-12.4-27.6-27.6-27.6-15.3 0-27.6 12.4-27.6 27.6v125.1c0 15.3 12.3 27.7 27.6 27.7z"></path><path class="lineal-stroke" d="M394.2 385.4c-23.3 0-42.1-18.9-42.1-42.1V218.2c0-23.3 18.9-42.1 42.2-42.1 13.3 0 25.8 6.3 33.7 16.9h2.5c27.5 0 49.8 22.3 49.8 49.8v76c0 27.5-22.3 49.8-49.8 49.8H428c-8 10.6-20.5 16.8-33.8 16.8zm0-180.4c-7.3 0-13.1 5.9-13.1 13.1v125.1c0 7.3 5.9 13.1 13.1 13.1 7.3 0 13.1-5.9 13.1-13.1 0-8 6.5-14.5 14.5-14.5 6.3 0 11.9 4.1 13.8 10.1 9.2-2.4 15.5-10.7 15.6-20.1v-76c0-9.5-6.4-17.7-15.6-20.1-2.4 7.6-10.6 11.8-18.2 9.4-6-1.9-10.1-7.5-10.1-13.8 0-7.3-5.9-13.2-13.1-13.2z"></path><path class="lineal-fill" d="M86 370.9c-15.3 0-27.6-12.4-27.6-27.6V354h-8.6c-19.5 0-35.3-15.8-35.3-35.3v-76c0-19.5 15.8-35.3 35.3-35.3h8.6v10.7c0-15.2 12.4-27.6 27.6-27.6 15.3 0 27.6 12.4 27.6 27.6v125.1c0 15.3-12.3 27.7-27.6 27.7z"></path><path class="lineal-stroke" d="M86 385.4c-13.3 0-25.8-6.3-33.7-16.9h-2.5C22.3 368.4 0 346.2 0 318.7v-76C.1 215.2 22.3 193 49.8 193h2.5c13.9-18.6 40.3-22.5 58.9-8.6 10.7 8 16.9 20.5 16.9 33.8v125c0 23.3-18.8 42.2-42.1 42.2zm-13.1-42.2c-.2 7.3 5.5 13.3 12.8 13.5 7.3.2 13.3-5.5 13.5-12.8V218.2c.2-7.3-5.5-13.3-12.8-13.5-7.3-.2-13.3 5.5-13.5 12.8v.7c0 8-6.5 14.5-14.5 14.5-6.3 0-11.9-4.1-13.8-10.1C35.4 225 29 233.3 29 242.7v76c0 9.4 6.4 17.7 15.6 20.1 2.4-7.6 10.6-11.8 18.2-9.4 6 1.9 10.1 7.5 10.1 13.8z"></path><circle class="lineal-fill" cx="255.8" cy="461.3" r="36.2"></circle><path class="lineal-stroke" d="M255.8 512c-28 0-50.7-22.7-50.7-50.7 0-28 22.7-50.7 50.7-50.7s50.7 22.7 50.7 50.7c-.1 28-22.8 50.7-50.7 50.7zm0-72.4c-12 0-21.7 9.7-21.7 21.7s9.7 21.7 21.7 21.7 21.7-9.7 21.7-21.7c-.1-11.9-9.8-21.6-21.7-21.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">headphone-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/headphone-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/headphone-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 511.99 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/heart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M308 164.23c-29.15 0-52 22.67-52 22.67s-21.56-22.67-52-22.67c-29.63 0-53.83 25.51-55.41 56.4-.9 17.44 4.49 30.72 12.09 42.75 15.17 24 95.45 84.39 95.45 84.39s80-60.16 95.26-84.39c7.61-12.08 13-25.31 12.09-42.75-1.59-30.89-25.78-56.4-55.42-56.4"></path><path class="lineal-stroke" d="M256.09 362.29a14.5 14.5 0 01-8.72-2.92c-8.44-6.34-82.88-62.7-99-88.24-6.72-10.65-15.52-27.55-14.31-51.25 2-39.35 32.73-70.17 69.91-70.17 22.91 0 41.42 10.4 52.2 18.35 11-7.88 29.74-18.35 51.87-18.35 37.18 0 67.89 30.82 69.91 70.17 1.21 23.65-7.59 40.57-14.31 51.24-16.22 25.75-90.41 81.93-98.81 88.25a14.55 14.55 0 01-8.74 2.92zM204 178.75c-21.35 0-39.71 19.12-40.91 42.62-.62 12.08 2.33 22.32 9.86 34.26 9.11 14.42 52.64 50.4 83.18 73.89 30.43-23.42 73.81-59.34 83-73.88 7.54-12 10.5-22.22 9.88-34.27-1.21-23.5-19.56-42.62-40.92-42.62-22.61 0-41.66 18.32-41.85 18.5a14.55 14.55 0 01-20.69-.34c-.2-.13-17.99-18.16-41.55-18.16z"></path><path class="lineal-stroke" d="M256 512a254.35 254.35 0 01-181-75 14.52 14.52 0 0120.54-20.53 227 227 0 10321-321 227 227 0 00-321 0 227.76 227.76 0 00-58.68 219.77 14.52 14.52 0 01-28 7.55A255.89 255.89 0 0175 75a256 256 0 01362 362 254.33 254.33 0 01-181 75z"></path><path class="lineal-stroke" d="M256 452c-108.1 0-196-87.91-196-196S147.9 60 256 60a196.7 196.7 0 01170 98.36 14.51 14.51 0 01-25.16 14.48A167.6 167.6 0 00256 89c-92.09 0-167 74.92-167 167s74.91 167 167 167 167-74.91 167-167a14.52 14.52 0 1129 0c0 108.09-87.92 196-196 196z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 511.99 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/heart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M308 164.23c-29.15 0-52 22.67-52 22.67s-21.56-22.67-52-22.67c-29.63 0-53.83 25.51-55.41 56.4-.9 17.44 4.49 30.72 12.09 42.75 15.17 24 95.45 84.39 95.45 84.39s80-60.16 95.26-84.39c7.61-12.08 13-25.31 12.09-42.75-1.59-30.89-25.78-56.4-55.42-56.4"></path><path class="lineal-stroke" d="M256.09 362.29a14.5 14.5 0 01-8.72-2.92c-8.44-6.34-82.88-62.7-99-88.24-6.72-10.65-15.52-27.55-14.31-51.25 2-39.35 32.73-70.17 69.91-70.17 22.91 0 41.42 10.4 52.2 18.35 11-7.88 29.74-18.35 51.87-18.35 37.18 0 67.89 30.82 69.91 70.17 1.21 23.65-7.59 40.57-14.31 51.24-16.22 25.75-90.41 81.93-98.81 88.25a14.55 14.55 0 01-8.74 2.92zM204 178.75c-21.35 0-39.71 19.12-40.91 42.62-.62 12.08 2.33 22.32 9.86 34.26 9.11 14.42 52.64 50.4 83.18 73.89 30.43-23.42 73.81-59.34 83-73.88 7.54-12 10.5-22.22 9.88-34.27-1.21-23.5-19.56-42.62-40.92-42.62-22.61 0-41.66 18.32-41.85 18.5a14.55 14.55 0 01-20.69-.34c-.2-.13-17.99-18.16-41.55-18.16z"></path><path class="lineal-stroke" d="M256 512a254.35 254.35 0 01-181-75 14.52 14.52 0 0120.54-20.53 227 227 0 10321-321 227 227 0 00-321 0 227.76 227.76 0 00-58.68 219.77 14.52 14.52 0 01-28 7.55A255.89 255.89 0 0175 75a256 256 0 01362 362 254.33 254.33 0 01-181 75z"></path><path class="lineal-stroke" d="M256 452c-108.1 0-196-87.91-196-196S147.9 60 256 60a196.7 196.7 0 01170 98.36 14.51 14.51 0 01-25.16 14.48A167.6 167.6 0 00256 89c-92.09 0-167 74.92-167 167s74.91 167 167 167 167-74.91 167-167a14.52 14.52 0 1129 0c0 108.09-87.92 196-196 196z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">heart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/heart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/heart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">home</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/home.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/home.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 317.51 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/hourglass.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M294.84 386.05a11.51 11.51 0 01-11.51-11.51V105.48a11.51 11.51 0 0123 0v269.06a11.51 11.51 0 01-11.51 11.51zm-272.17-15a11.51 11.51 0 01-11.51-11.51V33.41a11.51 11.51 0 0123 0v326.13a11.51 11.51 0 01-11.51 11.51zM158.76 215.8a110.83 110.83 0 01-110.7-110.7V19a11.51 11.51 0 0123 0v86.1a87.68 87.68 0 00175.36 0 11.51 11.51 0 1123 0 110.83 110.83 0 01-110.7 110.7z"></path><path class="lineal-fill" d="M284.11 55.3H33.41a21.9 21.9 0 110-43.79h250.7a21.9 21.9 0 010 43.79z"></path><path class="lineal-stroke" d="M284.11 66.81H33.41a33.41 33.41 0 110-66.81h250.7a33.41 33.41 0 010 66.81zM33.41 23a10.39 10.39 0 100 20.77h250.7a10.39 10.39 0 000-20.77zm26.16 379.12a11.51 11.51 0 01-11.51-11.51V304.5a110.7 110.7 0 11221.39 0 11.51 11.51 0 11-23 0 87.68 87.68 0 10-175.35 0v86.11a11.51 11.51 0 01-11.51 11.51z"></path><path class="lineal-fill" d="M109.78 385v-69.34a49 49 0 0197.95 0V385z"></path><path class="lineal-stroke" d="M207.73 396.55h-97.95A11.52 11.52 0 0198.27 385v-69.34a60.49 60.49 0 01121 0V385a11.51 11.51 0 01-11.51 11.51zm-86.43-23h74.92v-57.89a37.46 37.46 0 10-74.92 0z"></path><path class="lineal-fill" d="M33.41 354.3h250.7a21.9 21.9 0 010 43.79H33.41a21.9 21.9 0 110-43.79z"></path><path class="lineal-stroke" d="M284.11 409.6H33.41a33.41 33.41 0 110-66.81h250.7a33.41 33.41 0 010 66.81zm-250.7-43.79a10.39 10.39 0 100 20.77h250.7a10.39 10.39 0 000-20.77z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 317.51 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/hourglass.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M294.84 386.05a11.51 11.51 0 01-11.51-11.51V105.48a11.51 11.51 0 0123 0v269.06a11.51 11.51 0 01-11.51 11.51zm-272.17-15a11.51 11.51 0 01-11.51-11.51V33.41a11.51 11.51 0 0123 0v326.13a11.51 11.51 0 01-11.51 11.51zM158.76 215.8a110.83 110.83 0 01-110.7-110.7V19a11.51 11.51 0 0123 0v86.1a87.68 87.68 0 00175.36 0 11.51 11.51 0 1123 0 110.83 110.83 0 01-110.7 110.7z"></path><path class="lineal-fill" d="M284.11 55.3H33.41a21.9 21.9 0 110-43.79h250.7a21.9 21.9 0 010 43.79z"></path><path class="lineal-stroke" d="M284.11 66.81H33.41a33.41 33.41 0 110-66.81h250.7a33.41 33.41 0 010 66.81zM33.41 23a10.39 10.39 0 100 20.77h250.7a10.39 10.39 0 000-20.77zm26.16 379.12a11.51 11.51 0 01-11.51-11.51V304.5a110.7 110.7 0 11221.39 0 11.51 11.51 0 11-23 0 87.68 87.68 0 10-175.35 0v86.11a11.51 11.51 0 01-11.51 11.51z"></path><path class="lineal-fill" d="M109.78 385v-69.34a49 49 0 0197.95 0V385z"></path><path class="lineal-stroke" d="M207.73 396.55h-97.95A11.52 11.52 0 0198.27 385v-69.34a60.49 60.49 0 01121 0V385a11.51 11.51 0 01-11.51 11.51zm-86.43-23h74.92v-57.89a37.46 37.46 0 10-74.92 0z"></path><path class="lineal-fill" d="M33.41 354.3h250.7a21.9 21.9 0 010 43.79H33.41a21.9 21.9 0 110-43.79z"></path><path class="lineal-stroke" d="M284.11 409.6H33.41a33.41 33.41 0 110-66.81h250.7a33.41 33.41 0 010 66.81zm-250.7-43.79a10.39 10.39 0 100 20.77h250.7a10.39 10.39 0 000-20.77z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">hourglass</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/hourglass.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/hourglass.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 504.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/house.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M489.2 203.4H15L73.7 85.9h356.7zM209 355.9h86.1v141.2H209z"></path><path class="lineal-stroke" d="M502.2 195.9L444.7 81V15c0-8.3-6.7-15-15-15h-70.4c-8.3 0-15 6.7-15 15v56H73.7c-5.7 0-10.8 3.2-13.4 8.3L1.6 196.7c-3.7 7.4-.6 16.4 6.8 20.1 2.1 1 4.3 1.6 6.6 1.6h33.6V497c0 8.3 6.7 15 15 15h377c8.3 0 15-6.7 15-15V275.3c0-8.3-6.7-15-15-15h-92.1c-8.3 0-15 6.7-15 15v104c0 8.3 6.7 15 15 15h77.1v87.8H310.1V355.9c0-8.3-6.7-15-15-15H209c-8.3 0-15 6.7-15 15v126.2H78.5v-87.8h77.1c8.3 0 15-6.7 15-15v-104c0-8.3-6.7-15-15-15H78.5v-42h410.8c8.3 0 15-6.8 14.9-15.1 0-2.5-.7-5.1-2-7.3zM363.5 364.4v-74.1h62.2v74.1h-62.2zM224 370.8h56.2V482H224V370.8zm-83.3-80.5v74.1H78.5v-74.1h62.2zM374.3 29.9h40.5V71h-40.5V29.9zM39.2 188.4L83 100.9h338.2l43.8 87.5H39.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 504.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/house.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M489.2 203.4H15L73.7 85.9h356.7zM209 355.9h86.1v141.2H209z"></path><path class="lineal-stroke" d="M502.2 195.9L444.7 81V15c0-8.3-6.7-15-15-15h-70.4c-8.3 0-15 6.7-15 15v56H73.7c-5.7 0-10.8 3.2-13.4 8.3L1.6 196.7c-3.7 7.4-.6 16.4 6.8 20.1 2.1 1 4.3 1.6 6.6 1.6h33.6V497c0 8.3 6.7 15 15 15h377c8.3 0 15-6.7 15-15V275.3c0-8.3-6.7-15-15-15h-92.1c-8.3 0-15 6.7-15 15v104c0 8.3 6.7 15 15 15h77.1v87.8H310.1V355.9c0-8.3-6.7-15-15-15H209c-8.3 0-15 6.7-15 15v126.2H78.5v-87.8h77.1c8.3 0 15-6.7 15-15v-104c0-8.3-6.7-15-15-15H78.5v-42h410.8c8.3 0 15-6.8 14.9-15.1 0-2.5-.7-5.1-2-7.3zM363.5 364.4v-74.1h62.2v74.1h-62.2zM224 370.8h56.2V482H224V370.8zm-83.3-80.5v74.1H78.5v-74.1h62.2zM374.3 29.9h40.5V71h-40.5V29.9zM39.2 188.4L83 100.9h338.2l43.8 87.5H39.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">house</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/house.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/house.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 385" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/id-card.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M360.1 385H49.5C22.2 385 0 362.9 0 335.5V124.2c0-27.3 22.2-49.5 49.5-49.5h310.6c27.3 0 49.5 22.2 49.5 49.5v211.4c0 27.3-22.2 49.4-49.5 49.4zM49.5 97.6c-14.6 0-26.5 11.9-26.5 26.6v211.4c0 14.7 11.9 26.5 26.5 26.5h310.6c14.7 0 26.5-11.9 26.5-26.5V124.2c0-14.7-11.9-26.5-26.5-26.5l-310.6-.1z"></path><path class="lineal-fill" d="M262.6 51.9h-16.5c-.5-22.8-19.4-40.9-42.2-40.4-22.1.5-39.9 18.3-40.4 40.4H147c-18.9 0-34.2 15.3-34.2 34.2s15.3 34.2 34.2 34.2h115.6c18.9 0 34.2-15.3 34.2-34.2s-15.3-34.2-34.2-34.2z"></path><path class="lineal-stroke" d="M262.6 131.9H147c-25.2-.4-45.4-21.1-45-46.4.4-24.7 20.3-44.7 45-45h6.5c6.8-28.3 35.3-45.8 63.6-39 19.3 4.6 34.4 19.7 39 39h6.5c25.2.4 45.4 21.1 45 46.4-.4 24.6-20.3 44.6-45 45zM147 63.4c-12.6.3-22.5 10.7-22.3 23.2.3 12.2 10.1 22 22.3 22.3h115.6c12.6-.3 22.5-10.7 22.3-23.2-.3-12.2-10.1-22-22.3-22.3h-16.5c-6.2 0-11.3-5-11.5-11.2-.4-16.5-14.1-29.5-30.6-29.1-15.9.4-28.7 13.2-29.1 29.1-.1 6.2-5.2 11.2-11.5 11.2H147zm-4 234.3c-34.2-.1-61.9-28-61.7-62.3s28-61.9 62.3-61.7c5.3 0 10.5.7 15.6 2.1 6.1 1.6 9.8 7.9 8.1 14.1s-7.9 9.8-14.1 8.1c-20.8-5.6-42.3 6.7-47.9 27.6s6.7 42.3 27.6 47.9 42.3-6.7 47.9-27.6c.9-3.3 1.3-6.7 1.3-10.2.2-6.3 5.5-11.3 11.8-11.1 6.1.2 11 5.1 11.1 11.1 0 34.2-27.7 61.9-62 62z"></path><path class="lineal-fill" d="M180.5 300.2c-11.3-7-24.3-10.6-37.5-10.6-39.6.1-71.7 32.2-71.8 71.9v10.7h143.7v-10.7c-.1-25.1-13.1-48.2-34.4-61.3"></path><path class="lineal-stroke" d="M214.9 383.6H71.2c-6.3 0-11.5-5.1-11.5-11.4v-10.7c.5-46 38.2-82.9 84.2-82.4 45.3.5 81.9 37.1 82.4 82.4v10.7c0 6.3-5.1 11.4-11.4 11.4zM82.6 360.7h120.8c-.4-33.3-27.8-60-61.2-59.6-32.7.4-59.1 26.8-59.6 59.6zm255.9-111.9h-76.9c-6.3-.2-11.3-5.5-11.1-11.8.2-6.1 5.1-11 11.1-11.1h76.9c6.3-.2 11.6 4.8 11.8 11.1.2 6.3-4.8 11.6-11.1 11.8h-.7zm0 82.6h-76.9c-6.4 0-11.5-5.1-11.5-11.5s5.1-11.5 11.5-11.5h76.9c6.4 0 11.5 5.1 11.5 11.5s-5.2 11.5-11.5 11.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 385" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/id-card.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M360.1 385H49.5C22.2 385 0 362.9 0 335.5V124.2c0-27.3 22.2-49.5 49.5-49.5h310.6c27.3 0 49.5 22.2 49.5 49.5v211.4c0 27.3-22.2 49.4-49.5 49.4zM49.5 97.6c-14.6 0-26.5 11.9-26.5 26.6v211.4c0 14.7 11.9 26.5 26.5 26.5h310.6c14.7 0 26.5-11.9 26.5-26.5V124.2c0-14.7-11.9-26.5-26.5-26.5l-310.6-.1z"></path><path class="lineal-fill" d="M262.6 51.9h-16.5c-.5-22.8-19.4-40.9-42.2-40.4-22.1.5-39.9 18.3-40.4 40.4H147c-18.9 0-34.2 15.3-34.2 34.2s15.3 34.2 34.2 34.2h115.6c18.9 0 34.2-15.3 34.2-34.2s-15.3-34.2-34.2-34.2z"></path><path class="lineal-stroke" d="M262.6 131.9H147c-25.2-.4-45.4-21.1-45-46.4.4-24.7 20.3-44.7 45-45h6.5c6.8-28.3 35.3-45.8 63.6-39 19.3 4.6 34.4 19.7 39 39h6.5c25.2.4 45.4 21.1 45 46.4-.4 24.6-20.3 44.6-45 45zM147 63.4c-12.6.3-22.5 10.7-22.3 23.2.3 12.2 10.1 22 22.3 22.3h115.6c12.6-.3 22.5-10.7 22.3-23.2-.3-12.2-10.1-22-22.3-22.3h-16.5c-6.2 0-11.3-5-11.5-11.2-.4-16.5-14.1-29.5-30.6-29.1-15.9.4-28.7 13.2-29.1 29.1-.1 6.2-5.2 11.2-11.5 11.2H147zm-4 234.3c-34.2-.1-61.9-28-61.7-62.3s28-61.9 62.3-61.7c5.3 0 10.5.7 15.6 2.1 6.1 1.6 9.8 7.9 8.1 14.1s-7.9 9.8-14.1 8.1c-20.8-5.6-42.3 6.7-47.9 27.6s6.7 42.3 27.6 47.9 42.3-6.7 47.9-27.6c.9-3.3 1.3-6.7 1.3-10.2.2-6.3 5.5-11.3 11.8-11.1 6.1.2 11 5.1 11.1 11.1 0 34.2-27.7 61.9-62 62z"></path><path class="lineal-fill" d="M180.5 300.2c-11.3-7-24.3-10.6-37.5-10.6-39.6.1-71.7 32.2-71.8 71.9v10.7h143.7v-10.7c-.1-25.1-13.1-48.2-34.4-61.3"></path><path class="lineal-stroke" d="M214.9 383.6H71.2c-6.3 0-11.5-5.1-11.5-11.4v-10.7c.5-46 38.2-82.9 84.2-82.4 45.3.5 81.9 37.1 82.4 82.4v10.7c0 6.3-5.1 11.4-11.4 11.4zM82.6 360.7h120.8c-.4-33.3-27.8-60-61.2-59.6-32.7.4-59.1 26.8-59.6 59.6zm255.9-111.9h-76.9c-6.3-.2-11.3-5.5-11.1-11.8.2-6.1 5.1-11 11.1-11.1h76.9c6.3-.2 11.6 4.8 11.8 11.1.2 6.3-4.8 11.6-11.1 11.8h-.7zm0 82.6h-76.9c-6.4 0-11.5-5.1-11.5-11.5s5.1-11.5 11.5-11.5h76.9c6.4 0 11.5 5.1 11.5 11.5s-5.2 11.5-11.5 11.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">id-card</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/id-card.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/id-card.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.41 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/insurance.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M254.93 457a46.24 46.24 0 01-24.13-40.62V285.62A70 70 0 00307.94 270a100.73 100.73 0 00-81.62-41.61h-110.6A100.88 100.88 0 0014.84 329.31v167.85H327.2v-.81z"></path><path class="lineal-stroke" d="M426.57 270.78a14.85 14.85 0 00-14.85 14.84v130.72a31.41 31.41 0 01-16.38 27.59l-66.66 36.32L262 443.93a31.4 31.4 0 01-16.39-27.59V305.05a85.35 85.35 0 0012.31.89c1.26 0 2.51 0 3.76-.1h1c1.13-.06 2.25-.14 3.37-.25l1.59-.18 1.65-.2a83.72 83.72 0 0041.13-17.47l1.09-.86 1.28-1.07c.85-.72 1.69-1.47 2.52-2.23l.41-.38c.95-.88 1.88-1.79 2.78-2.71a85 85 0 0010.13-12.56 85.74 85.74 0 0028 26.55 14.84 14.84 0 0015-25.63A55.78 55.78 0 01349 243.37a14.85 14.85 0 00-13.58-8.85h-13.48a14.85 14.85 0 00-13.58 8.85c-.45 1-.94 2-1.44 3a116.46 116.46 0 00-45.39-27.21 87.22 87.22 0 0027.23-63.34V87.5a14.85 14.85 0 00-29.69 0v68.29A57.86 57.86 0 01202 213.58h-62a57.86 57.86 0 01-57-57.79V87.5a57.87 57.87 0 0157.81-57.81h60.48a14.85 14.85 0 000-29.69h-60.51a87.6 87.6 0 00-87.5 87.5v68.29a87.23 87.23 0 0027.19 63.3A115.93 115.93 0 000 329.31v167.85A14.85 14.85 0 0014.84 512h313.84a14.76 14.76 0 007.1-1.81L409.54 470a61.06 61.06 0 0031.87-53.65V285.63a14.85 14.85 0 00-14.84-14.85z"></path><path class="lineal-fill" d="M29.69 482.31v-153a86.13 86.13 0 0186-86h40.45v144.15a14.84 14.84 0 1029.68 0V243.29h40.46a86.35 86.35 0 0160.4 24.82 55 55 0 01-20.58 7.54h-.15c-1.15.17-2.31.29-3.47.38l-.56.06c-1.24.09-2.49.13-3.74.14H258a54.76 54.76 0 01-21.38-4.3A14.84 14.84 0 00216 285.62v130.72A61.12 61.12 0 00247.82 470l22.6 12.31z"></path><path class="lineal-stroke" d="M327.19 405.92a14.81 14.81 0 01-7.22-1.87l-24.85-13.86a14.84 14.84 0 0114.45-25.93l15.67 8.74 34.06-30.14a14.84 14.84 0 1119.7 22.23l-42 37.11a14.82 14.82 0 01-9.81 3.72z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.41 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/insurance.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M254.93 457a46.24 46.24 0 01-24.13-40.62V285.62A70 70 0 00307.94 270a100.73 100.73 0 00-81.62-41.61h-110.6A100.88 100.88 0 0014.84 329.31v167.85H327.2v-.81z"></path><path class="lineal-stroke" d="M426.57 270.78a14.85 14.85 0 00-14.85 14.84v130.72a31.41 31.41 0 01-16.38 27.59l-66.66 36.32L262 443.93a31.4 31.4 0 01-16.39-27.59V305.05a85.35 85.35 0 0012.31.89c1.26 0 2.51 0 3.76-.1h1c1.13-.06 2.25-.14 3.37-.25l1.59-.18 1.65-.2a83.72 83.72 0 0041.13-17.47l1.09-.86 1.28-1.07c.85-.72 1.69-1.47 2.52-2.23l.41-.38c.95-.88 1.88-1.79 2.78-2.71a85 85 0 0010.13-12.56 85.74 85.74 0 0028 26.55 14.84 14.84 0 0015-25.63A55.78 55.78 0 01349 243.37a14.85 14.85 0 00-13.58-8.85h-13.48a14.85 14.85 0 00-13.58 8.85c-.45 1-.94 2-1.44 3a116.46 116.46 0 00-45.39-27.21 87.22 87.22 0 0027.23-63.34V87.5a14.85 14.85 0 00-29.69 0v68.29A57.86 57.86 0 01202 213.58h-62a57.86 57.86 0 01-57-57.79V87.5a57.87 57.87 0 0157.81-57.81h60.48a14.85 14.85 0 000-29.69h-60.51a87.6 87.6 0 00-87.5 87.5v68.29a87.23 87.23 0 0027.19 63.3A115.93 115.93 0 000 329.31v167.85A14.85 14.85 0 0014.84 512h313.84a14.76 14.76 0 007.1-1.81L409.54 470a61.06 61.06 0 0031.87-53.65V285.63a14.85 14.85 0 00-14.84-14.85z"></path><path class="lineal-fill" d="M29.69 482.31v-153a86.13 86.13 0 0186-86h40.45v144.15a14.84 14.84 0 1029.68 0V243.29h40.46a86.35 86.35 0 0160.4 24.82 55 55 0 01-20.58 7.54h-.15c-1.15.17-2.31.29-3.47.38l-.56.06c-1.24.09-2.49.13-3.74.14H258a54.76 54.76 0 01-21.38-4.3A14.84 14.84 0 00216 285.62v130.72A61.12 61.12 0 00247.82 470l22.6 12.31z"></path><path class="lineal-stroke" d="M327.19 405.92a14.81 14.81 0 01-7.22-1.87l-24.85-13.86a14.84 14.84 0 0114.45-25.93l15.67 8.74 34.06-30.14a14.84 14.84 0 1119.7 22.23l-42 37.11a14.82 14.82 0 01-9.81 3.72z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">insurance</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/insurance.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/insurance.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 506.19 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/invoice.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M146.33 288.23v-46.51c18.56 3.25 21.36 13.54 21.78 19.59a2.93 2.93 0 002.94 2.75h20.27a3 3 0 003-3.14c-1.32-25.51-18.8-41.92-47.95-45.61v-15.64a3 3 0 00-3-2.95h-20.26a3 3 0 00-3 2.95v15.64c-30.32 3.84-48 21.45-48 48.75s17.7 44.91 48 48.75v46.51c-18.56-3.26-21.35-13.55-21.77-19.6a3 3 0 00-2.9-2.72H75.16a3 3 0 00-3 3.14C73.52 365.62 91 382 120.15 385.72v15.64a3 3 0 002.95 2.95h20.28a3 3 0 003-2.95v-15.64c30.33-3.83 48-21.45 48-48.75s-17.72-44.91-48.05-48.74zm-26.18-1.82C98.31 282.58 98.3 269 98.3 264.07s0-18.52 21.85-22.35zm26.18 72.91v-44.69c21.85 3.83 21.85 17.4 21.85 22.34s0 18.52-21.85 22.35z"></path><path class="lineal-stroke" d="M407.05 512H15.86A15.86 15.86 0 010 496.14V160.78a15.86 15.86 0 0131.72 0v319.5h375.33a15.86 15.86 0 110 31.72z"></path><path class="lineal-fill" d="M388.37 138.963l50.005-85.2 51.944 30.488-50.006 85.2z"></path><path class="lineal-fill" d="M137.92 126.64h257.71l42.75-72.85 35 20.54a69.55 69.55 0 00-68.43-58.45H82.51a69.49 69.49 0 0169.29 69.29 68.86 68.86 0 01-13.88 41.47z"></path><path class="lineal-stroke" d="M505.68 80.29a15.86 15.86 0 00-7.32-9.68l-10.93-6.42C477.91 27.12 443.75 0 404.94 0H86.11A86 86 0 000 86a15.86 15.86 0 0031.72 0A54.54 54.54 0 0181.6 31.7h.91a53.49 53.49 0 0153.43 53.43 52.81 52.81 0 01-10.7 32 15.85 15.85 0 0012.68 25.38h230L246.17 349.94a15.87 15.87 0 00-1.57 12.38l11.42 40a15.86 15.86 0 0015.24 11.51 16.29 16.29 0 003.65-.42l40.52-9.55a15.83 15.83 0 0010-7.41l65.72-112v135.62a15.86 15.86 0 0031.72 0V228.49a16.21 16.21 0 00-30-9.62l-91.32 155.71-19.18 4.51-5.37-18.94L394 160.7l38.26 22.46a15.87 15.87 0 0021.74-5.65l50-85.2a15.85 15.85 0 001.68-12.02zM148.76 31.74h256.18A52.94 52.94 0 01432 39.26l-.17.09a17.64 17.64 0 00-1.92 1l-.28.2a14.82 14.82 0 00-1.7 1.28l-.13.11a15.63 15.63 0 00-1.55 1.6l-.29.36a16.45 16.45 0 00-1.29 1.85l-38.16 65H163.72a85.15 85.15 0 00-15-79.05zm285.91 116l-24.58-14.43L444 75.5l24.58 14.43z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 506.19 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/invoice.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M146.33 288.23v-46.51c18.56 3.25 21.36 13.54 21.78 19.59a2.93 2.93 0 002.94 2.75h20.27a3 3 0 003-3.14c-1.32-25.51-18.8-41.92-47.95-45.61v-15.64a3 3 0 00-3-2.95h-20.26a3 3 0 00-3 2.95v15.64c-30.32 3.84-48 21.45-48 48.75s17.7 44.91 48 48.75v46.51c-18.56-3.26-21.35-13.55-21.77-19.6a3 3 0 00-2.9-2.72H75.16a3 3 0 00-3 3.14C73.52 365.62 91 382 120.15 385.72v15.64a3 3 0 002.95 2.95h20.28a3 3 0 003-2.95v-15.64c30.33-3.83 48-21.45 48-48.75s-17.72-44.91-48.05-48.74zm-26.18-1.82C98.31 282.58 98.3 269 98.3 264.07s0-18.52 21.85-22.35zm26.18 72.91v-44.69c21.85 3.83 21.85 17.4 21.85 22.34s0 18.52-21.85 22.35z"></path><path class="lineal-stroke" d="M407.05 512H15.86A15.86 15.86 0 010 496.14V160.78a15.86 15.86 0 0131.72 0v319.5h375.33a15.86 15.86 0 110 31.72z"></path><path class="lineal-fill" d="M388.37 138.963l50.005-85.2 51.944 30.488-50.006 85.2z"></path><path class="lineal-fill" d="M137.92 126.64h257.71l42.75-72.85 35 20.54a69.55 69.55 0 00-68.43-58.45H82.51a69.49 69.49 0 0169.29 69.29 68.86 68.86 0 01-13.88 41.47z"></path><path class="lineal-stroke" d="M505.68 80.29a15.86 15.86 0 00-7.32-9.68l-10.93-6.42C477.91 27.12 443.75 0 404.94 0H86.11A86 86 0 000 86a15.86 15.86 0 0031.72 0A54.54 54.54 0 0181.6 31.7h.91a53.49 53.49 0 0153.43 53.43 52.81 52.81 0 01-10.7 32 15.85 15.85 0 0012.68 25.38h230L246.17 349.94a15.87 15.87 0 00-1.57 12.38l11.42 40a15.86 15.86 0 0015.24 11.51 16.29 16.29 0 003.65-.42l40.52-9.55a15.83 15.83 0 0010-7.41l65.72-112v135.62a15.86 15.86 0 0031.72 0V228.49a16.21 16.21 0 00-30-9.62l-91.32 155.71-19.18 4.51-5.37-18.94L394 160.7l38.26 22.46a15.87 15.87 0 0021.74-5.65l50-85.2a15.85 15.85 0 001.68-12.02zM148.76 31.74h256.18A52.94 52.94 0 01432 39.26l-.17.09a17.64 17.64 0 00-1.92 1l-.28.2a14.82 14.82 0 00-1.7 1.28l-.13.11a15.63 15.63 0 00-1.55 1.6l-.29.36a16.45 16.45 0 00-1.29 1.85l-38.16 65H163.72a85.15 85.15 0 00-15-79.05zm285.91 116l-24.58-14.43L444 75.5l24.58 14.43z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">invoice</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/invoice.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/invoice.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 306.75" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/laptop.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M383.05 259.54H26.55V36.19A36.23 36.23 0 0162.74 0h284.12a36.22 36.22 0 0136.19 36.19zM48.63 237.46H361V36.19a14.12 14.12 0 00-14.1-14.11H62.74a14.13 14.13 0 00-14.11 14.11z"></path><path class="lineal-stroke" d="M338.88 259.54H70.72V69.26a25.12 25.12 0 0125.09-25.1h218a25.13 25.13 0 0125.1 25.1H316.8a3 3 0 00-3-3h-218a3 3 0 00-3 3v168.2h224v-123.8h22.08z"></path><path class="lineal-fill" d="M386.48 295.71H23.12A12.08 12.08 0 0111 283.63v-23a12.08 12.08 0 0112.12-12.13h363.36a12.08 12.08 0 0112.08 12.09v23a12.08 12.08 0 01-12.08 12.08z"></path><path class="lineal-stroke" d="M386.48 306.75H23.12A23.14 23.14 0 010 283.63v-23a23.14 23.14 0 0123.12-23.12h363.36a23.14 23.14 0 0123.12 23.12v23a23.14 23.14 0 01-23.12 23.12zM23.12 259.54a1 1 0 00-1 1v23a1 1 0 001 1h363.36a1 1 0 001-1v-23a1 1 0 00-1-1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 306.75" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/laptop.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M383.05 259.54H26.55V36.19A36.23 36.23 0 0162.74 0h284.12a36.22 36.22 0 0136.19 36.19zM48.63 237.46H361V36.19a14.12 14.12 0 00-14.1-14.11H62.74a14.13 14.13 0 00-14.11 14.11z"></path><path class="lineal-stroke" d="M338.88 259.54H70.72V69.26a25.12 25.12 0 0125.09-25.1h218a25.13 25.13 0 0125.1 25.1H316.8a3 3 0 00-3-3h-218a3 3 0 00-3 3v168.2h224v-123.8h22.08z"></path><path class="lineal-fill" d="M386.48 295.71H23.12A12.08 12.08 0 0111 283.63v-23a12.08 12.08 0 0112.12-12.13h363.36a12.08 12.08 0 0112.08 12.09v23a12.08 12.08 0 01-12.08 12.08z"></path><path class="lineal-stroke" d="M386.48 306.75H23.12A23.14 23.14 0 010 283.63v-23a23.14 23.14 0 0123.12-23.12h363.36a23.14 23.14 0 0123.12 23.12v23a23.14 23.14 0 01-23.12 23.12zM23.12 259.54a1 1 0 00-1 1v23a1 1 0 001 1h363.36a1 1 0 001-1v-23a1 1 0 00-1-1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">laptop</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/laptop.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/laptop.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 492.45" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/levels.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M80.52 492.45a15.19 15.19 0 01-15.19-15.19v-256a15.2 15.2 0 1130.39 0v256a15.2 15.2 0 01-15.2 15.19zm0-355.52a15.19 15.19 0 01-15.19-15.19V80.53a15.2 15.2 0 0130.39 0v41.21a15.2 15.2 0 01-15.2 15.19zM256 492.45a15.19 15.19 0 01-15.19-15.19v-94.19a15.19 15.19 0 1130.38 0v94.19A15.19 15.19 0 01256 492.45zm0-297.78a15.2 15.2 0 01-15.19-15.2V15.19a15.19 15.19 0 0130.38 0v164.29A15.19 15.19 0 01256 194.67zm175.48 297.78a15.2 15.2 0 01-15.2-15.19V263.79a15.2 15.2 0 0130.39 0v213.47a15.19 15.19 0 01-15.19 15.19zm0-350.96a15.2 15.2 0 01-15.2-15.19V15.19a15.2 15.2 0 0130.39 0V126.3a15.19 15.19 0 01-15.19 15.19z"></path><circle class="lineal-fill" cx="80.52" cy="80.53" r="65.33"></circle><path class="lineal-stroke" d="M80.52 161.05a80.52 80.52 0 1180.53-80.52 80.61 80.61 0 01-80.53 80.52zm0-130.66a50.14 50.14 0 1050.14 50.14 50.19 50.19 0 00-50.14-50.14zM256 398.26a80.48 80.48 0 1170.54-41.66 15.19 15.19 0 11-26.6-14.68A50.15 50.15 0 10256 367.87a15.2 15.2 0 010 30.39z"></path><circle class="lineal-fill" cx="431.48" cy="126.29" r="65.33"></circle><path class="lineal-stroke" d="M431.48 206.82A80.52 80.52 0 11512 126.3a80.62 80.62 0 01-80.52 80.52zm0-130.66a50.14 50.14 0 1050.13 50.14 50.19 50.19 0 00-50.13-50.14z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 492.45" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/levels.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M80.52 492.45a15.19 15.19 0 01-15.19-15.19v-256a15.2 15.2 0 1130.39 0v256a15.2 15.2 0 01-15.2 15.19zm0-355.52a15.19 15.19 0 01-15.19-15.19V80.53a15.2 15.2 0 0130.39 0v41.21a15.2 15.2 0 01-15.2 15.19zM256 492.45a15.19 15.19 0 01-15.19-15.19v-94.19a15.19 15.19 0 1130.38 0v94.19A15.19 15.19 0 01256 492.45zm0-297.78a15.2 15.2 0 01-15.19-15.2V15.19a15.19 15.19 0 0130.38 0v164.29A15.19 15.19 0 01256 194.67zm175.48 297.78a15.2 15.2 0 01-15.2-15.19V263.79a15.2 15.2 0 0130.39 0v213.47a15.19 15.19 0 01-15.19 15.19zm0-350.96a15.2 15.2 0 01-15.2-15.19V15.19a15.2 15.2 0 0130.39 0V126.3a15.19 15.19 0 01-15.19 15.19z"></path><circle class="lineal-fill" cx="80.52" cy="80.53" r="65.33"></circle><path class="lineal-stroke" d="M80.52 161.05a80.52 80.52 0 1180.53-80.52 80.61 80.61 0 01-80.53 80.52zm0-130.66a50.14 50.14 0 1050.14 50.14 50.19 50.19 0 00-50.14-50.14zM256 398.26a80.48 80.48 0 1170.54-41.66 15.19 15.19 0 11-26.6-14.68A50.15 50.15 0 10256 367.87a15.2 15.2 0 010 30.39z"></path><circle class="lineal-fill" cx="431.48" cy="126.29" r="65.33"></circle><path class="lineal-stroke" d="M431.48 206.82A80.52 80.52 0 11512 126.3a80.62 80.62 0 01-80.52 80.52zm0-130.66a50.14 50.14 0 1050.13 50.14 50.19 50.19 0 00-50.13-50.14z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">levels</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/levels.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/levels.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">light-bulb</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/light-bulb.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/light-bulb.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/link.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M240.3 101.8l-58.1-58.1C144.1 5.6 81.8 5.6 43.8 43.7c-38.1 38.1-38.1 100.4 0 138.5l58.1 58.1c38.1 38.1 100.4 38.1 138.5 0 38-38.1 38-100.4-.1-138.5zM141 201.2l-58.1-58.1c-16.6-16.6-16.6-43.6 0-60.2s43.6-16.6 60.2 0l58.1 58.1c16.6 16.6 16.6 43.6 0 60.2s-43.6 16.6-60.2 0z"></path><path class="lineal-stroke" d="M171.1 284c-30 .1-58.8-11.8-79.9-33l-58.1-58.1C-10.6 148.2-9.7 76.6 34.9 33c44-42.9 114.1-42.9 158 0L251 91.1c44.2 44.1 44.2 115.6.2 159.7-21.2 21.3-50 33.2-80.1 33.2zM113 30.3c-45.6-.1-82.7 36.8-82.8 82.5 0 22 8.7 43.1 24.3 58.7l58.1 58.1c31.5 33.2 83.8 34.5 117 3.1s34.5-83.8 3.1-117c-1-1.1-2-2.1-3.1-3.1l-58.1-58.1A81.978 81.978 0 00113 30.3zm58.1 198.5c-15.3 0-30-6-40.8-16.9l-58.1-58.1c-22.4-22.8-22.1-59.3.6-81.7 22.5-22.1 58.5-22.1 81 0l58.1 58.1c22.5 22.5 22.5 59.1 0 81.6-10.8 10.9-25.5 17-40.8 17zM113 85.5c-15.1 0-27.4 12.3-27.4 27.4 0 7.3 2.9 14.3 8 19.4l58.1 58.1c10.9 10.5 28.3 10.2 38.8-.7 10.3-10.6 10.3-27.5 0-38.1l-58.1-58.1c-5.1-5.1-12.1-8-19.4-8zm286 426.4c-30 .1-58.8-11.8-79.9-33.1l-58.1-58c-43.3-45-41.9-116.6 3.1-159.9 43.8-42.1 112.9-42.1 156.7 0 6 5.9 6 15.5.1 21.4-5.9 6-15.5 6-21.4.1l-.1-.1c-33.2-31.5-85.5-30.1-117 3.1-30.3 31.9-30.3 82 0 113.9l58.1 58.1c31.5 33.2 83.8 34.5 117 3.1s34.5-83.8 3.1-117c-1-1.1-2-2.1-3.1-3.1-5.7-6.1-5.4-15.7.7-21.4 5.8-5.5 14.9-5.5 20.8 0 44.2 44.1 44.3 115.6.2 159.8-21.3 21.3-50.1 33.2-80.2 33.1zm0-55.3c-15.3 0-30-6-40.8-16.9l-58.1-58.1c-22.5-22.5-22.5-59.1 0-81.6 22.5-22.5 59.1-22.5 81.6 0 6 5.9 6 15.5.1 21.4-5.9 6-15.5 6-21.4.1l-.1-.1c-10.9-10.5-28.3-10.2-38.8.7-10.3 10.6-10.3 27.5 0 38.1l58.1 58.1c10.7 10.7 28.1 10.7 38.8 0 10.7-10.7 10.7-28.1 0-38.8-5.9-5.9-5.9-15.5 0-21.4s15.5-5.9 21.4 0c22.5 22.5 22.6 59.1 0 81.6-10.8 10.9-25.5 16.9-40.8 16.9z"></path><path class="lineal-stroke" d="M310.8 325.9c-4 0-7.9-1.6-10.7-4.4L190.5 211.9c-5.8-6-5.6-15.6.5-21.4 5.9-5.6 15.1-5.6 20.9 0L321.5 300c5.9 5.9 5.9 15.5 0 21.4-2.9 2.9-6.7 4.5-10.7 4.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/link.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M240.3 101.8l-58.1-58.1C144.1 5.6 81.8 5.6 43.8 43.7c-38.1 38.1-38.1 100.4 0 138.5l58.1 58.1c38.1 38.1 100.4 38.1 138.5 0 38-38.1 38-100.4-.1-138.5zM141 201.2l-58.1-58.1c-16.6-16.6-16.6-43.6 0-60.2s43.6-16.6 60.2 0l58.1 58.1c16.6 16.6 16.6 43.6 0 60.2s-43.6 16.6-60.2 0z"></path><path class="lineal-stroke" d="M171.1 284c-30 .1-58.8-11.8-79.9-33l-58.1-58.1C-10.6 148.2-9.7 76.6 34.9 33c44-42.9 114.1-42.9 158 0L251 91.1c44.2 44.1 44.2 115.6.2 159.7-21.2 21.3-50 33.2-80.1 33.2zM113 30.3c-45.6-.1-82.7 36.8-82.8 82.5 0 22 8.7 43.1 24.3 58.7l58.1 58.1c31.5 33.2 83.8 34.5 117 3.1s34.5-83.8 3.1-117c-1-1.1-2-2.1-3.1-3.1l-58.1-58.1A81.978 81.978 0 00113 30.3zm58.1 198.5c-15.3 0-30-6-40.8-16.9l-58.1-58.1c-22.4-22.8-22.1-59.3.6-81.7 22.5-22.1 58.5-22.1 81 0l58.1 58.1c22.5 22.5 22.5 59.1 0 81.6-10.8 10.9-25.5 17-40.8 17zM113 85.5c-15.1 0-27.4 12.3-27.4 27.4 0 7.3 2.9 14.3 8 19.4l58.1 58.1c10.9 10.5 28.3 10.2 38.8-.7 10.3-10.6 10.3-27.5 0-38.1l-58.1-58.1c-5.1-5.1-12.1-8-19.4-8zm286 426.4c-30 .1-58.8-11.8-79.9-33.1l-58.1-58c-43.3-45-41.9-116.6 3.1-159.9 43.8-42.1 112.9-42.1 156.7 0 6 5.9 6 15.5.1 21.4-5.9 6-15.5 6-21.4.1l-.1-.1c-33.2-31.5-85.5-30.1-117 3.1-30.3 31.9-30.3 82 0 113.9l58.1 58.1c31.5 33.2 83.8 34.5 117 3.1s34.5-83.8 3.1-117c-1-1.1-2-2.1-3.1-3.1-5.7-6.1-5.4-15.7.7-21.4 5.8-5.5 14.9-5.5 20.8 0 44.2 44.1 44.3 115.6.2 159.8-21.3 21.3-50.1 33.2-80.2 33.1zm0-55.3c-15.3 0-30-6-40.8-16.9l-58.1-58.1c-22.5-22.5-22.5-59.1 0-81.6 22.5-22.5 59.1-22.5 81.6 0 6 5.9 6 15.5.1 21.4-5.9 6-15.5 6-21.4.1l-.1-.1c-10.9-10.5-28.3-10.2-38.8.7-10.3 10.6-10.3 27.5 0 38.1l58.1 58.1c10.7 10.7 28.1 10.7 38.8 0 10.7-10.7 10.7-28.1 0-38.8-5.9-5.9-5.9-15.5 0-21.4s15.5-5.9 21.4 0c22.5 22.5 22.6 59.1 0 81.6-10.8 10.9-25.5 16.9-40.8 16.9z"></path><path class="lineal-stroke" d="M310.8 325.9c-4 0-7.9-1.6-10.7-4.4L190.5 211.9c-5.8-6-5.6-15.6.5-21.4 5.9-5.6 15.1-5.6 20.9 0L321.5 300c5.9 5.9 5.9 15.5 0 21.4-2.9 2.9-6.7 4.5-10.7 4.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">link</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/link.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/link.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 447" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/list.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M102.4 447C45.8 447 0 401.1 0 344.6s45.9-102.4 102.4-102.4c36.3 0 69.9 19.2 88.3 50.5 4.1 6.9 1.8 15.8-5.2 19.9-6.9 4.1-15.8 1.8-19.9-5.2-20.5-34.9-65.4-46.6-100.3-26.1s-46.6 65.4-26.1 100.3 65.4 46.6 100.3 26.1c10.2-6 18.8-14.3 25-24.3 4.3-6.8 13.2-8.9 20.1-4.6 6.8 4.3 8.9 13.2 4.6 20.1-18.7 30-51.5 48.2-86.8 48.1zm395.1-119.8H254.3c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h243.1c8 .2 14.4 6.9 14.2 14.9-.2 7.8-6.4 14-14.1 14.2zm-91.2 63.9h-152c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h152c8 .2 14.4 6.9 14.2 14.9-.2 7.7-6.5 14-14.2 14.2z"></path><circle class="lineal-fill" cx="102.4" cy="102.4" r="87.8"></circle><path class="lineal-stroke" d="M102.4 204.8C45.8 204.8 0 158.9 0 102.4S45.8 0 102.4 0s102.4 45.8 102.4 102.4c-.1 56.5-45.9 102.3-102.4 102.4zm0-175.7c-40.5 0-73.3 32.8-73.3 73.3s32.8 73.3 73.3 73.3 73.3-32.8 73.3-73.3c-.1-40.5-32.9-73.2-73.3-73.3zM497.5 85H254.3c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h243.1c8 .2 14.4 6.9 14.2 14.9-.2 7.8-6.4 14-14.1 14.2zm-91.2 63.8h-152c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h152c8 .2 14.4 6.9 14.2 14.9-.2 7.8-6.5 14-14.2 14.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 447" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/list.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M102.4 447C45.8 447 0 401.1 0 344.6s45.9-102.4 102.4-102.4c36.3 0 69.9 19.2 88.3 50.5 4.1 6.9 1.8 15.8-5.2 19.9-6.9 4.1-15.8 1.8-19.9-5.2-20.5-34.9-65.4-46.6-100.3-26.1s-46.6 65.4-26.1 100.3 65.4 46.6 100.3 26.1c10.2-6 18.8-14.3 25-24.3 4.3-6.8 13.2-8.9 20.1-4.6 6.8 4.3 8.9 13.2 4.6 20.1-18.7 30-51.5 48.2-86.8 48.1zm395.1-119.8H254.3c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h243.1c8 .2 14.4 6.9 14.2 14.9-.2 7.8-6.4 14-14.1 14.2zm-91.2 63.9h-152c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h152c8 .2 14.4 6.9 14.2 14.9-.2 7.7-6.5 14-14.2 14.2z"></path><circle class="lineal-fill" cx="102.4" cy="102.4" r="87.8"></circle><path class="lineal-stroke" d="M102.4 204.8C45.8 204.8 0 158.9 0 102.4S45.8 0 102.4 0s102.4 45.8 102.4 102.4c-.1 56.5-45.9 102.3-102.4 102.4zm0-175.7c-40.5 0-73.3 32.8-73.3 73.3s32.8 73.3 73.3 73.3 73.3-32.8 73.3-73.3c-.1-40.5-32.9-73.2-73.3-73.3zM497.5 85H254.3c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h243.1c8 .2 14.4 6.9 14.2 14.9-.2 7.8-6.4 14-14.1 14.2zm-91.2 63.8h-152c-8-.2-14.4-6.9-14.2-14.9.2-7.7 6.4-14 14.2-14.2h152c8 .2 14.4 6.9 14.2 14.9-.2 7.8-6.5 14-14.2 14.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">list</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/list.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/list.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 353.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/loading.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M176.6 353.3c-46.9 0-91.9-18.6-125-51.8-68.9-68.9-68.9-181 0-249.9 69-69 180.9-69 249.9 0 24 24 40.5 54.3 47.7 87.5.4 1.9.8 3.9 1.2 6.2l2.7 14.8c1.1 6.2-3 12.2-9.3 13.3-.7.1-1.3.2-2 .2h-51c-5.4 0-10-3.7-11.2-9l-2.1-9.9C265.3 99 210.1 63.8 154.4 76.1s-90.9 67.4-78.6 123.2c7.9 35.6 33.9 64.4 68.6 75.8 3 1 6.1 1.8 9.1 2.5 6.2 1.4 10 7.5 8.6 13.7-1.4 6.2-7.5 10-13.7 8.6-3.7-.9-7.5-1.9-11.1-3.1C71 275 34.9 203.4 56.8 137c6.2-18.7 16.6-35.7 30.5-49.7 49.2-49.3 129-49.5 178.4-.3 17.3 17.2 29.2 39 34.3 62.9l.2.9h28.1l-.2-1.4c-.4-2-.7-3.8-1.1-5.4C308.9 60.9 226.9 8.3 143.8 26.4c-28.8 6.3-55.2 20.7-76 41.5-60 60-60 157.6 0 217.6 41 41.1 101.7 55.5 156.9 37.4L206 290.3c-3-5.6-.9-12.5 4.6-15.5 5.3-2.9 12-1.1 15.2 4.1l25.6 44.4c3.2 5.5 1.3 12.5-4.2 15.6-.6.4-1.3.7-2 .9l-10.8 3.7c-18.6 6.5-38.1 9.8-57.8 9.8z"></path><path class="lineal-fill" d="M236.6 160.7l80.8 140 80.8-140H236.6z"></path><path class="lineal-stroke" d="M317.4 312.1c-4.1 0-7.9-2.2-9.9-5.7l-80.8-140c-3.2-5.5-1.3-12.5 4.2-15.6 1.7-1 3.7-1.5 5.7-1.5h161.6c6.3 0 11.4 5.1 11.4 11.4 0 2-.5 4-1.5 5.7l-80.8 140c-2.1 3.6-5.9 5.7-9.9 5.7zm-61-140l61 105.7 61-105.7h-122z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 353.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/loading.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M176.6 353.3c-46.9 0-91.9-18.6-125-51.8-68.9-68.9-68.9-181 0-249.9 69-69 180.9-69 249.9 0 24 24 40.5 54.3 47.7 87.5.4 1.9.8 3.9 1.2 6.2l2.7 14.8c1.1 6.2-3 12.2-9.3 13.3-.7.1-1.3.2-2 .2h-51c-5.4 0-10-3.7-11.2-9l-2.1-9.9C265.3 99 210.1 63.8 154.4 76.1s-90.9 67.4-78.6 123.2c7.9 35.6 33.9 64.4 68.6 75.8 3 1 6.1 1.8 9.1 2.5 6.2 1.4 10 7.5 8.6 13.7-1.4 6.2-7.5 10-13.7 8.6-3.7-.9-7.5-1.9-11.1-3.1C71 275 34.9 203.4 56.8 137c6.2-18.7 16.6-35.7 30.5-49.7 49.2-49.3 129-49.5 178.4-.3 17.3 17.2 29.2 39 34.3 62.9l.2.9h28.1l-.2-1.4c-.4-2-.7-3.8-1.1-5.4C308.9 60.9 226.9 8.3 143.8 26.4c-28.8 6.3-55.2 20.7-76 41.5-60 60-60 157.6 0 217.6 41 41.1 101.7 55.5 156.9 37.4L206 290.3c-3-5.6-.9-12.5 4.6-15.5 5.3-2.9 12-1.1 15.2 4.1l25.6 44.4c3.2 5.5 1.3 12.5-4.2 15.6-.6.4-1.3.7-2 .9l-10.8 3.7c-18.6 6.5-38.1 9.8-57.8 9.8z"></path><path class="lineal-fill" d="M236.6 160.7l80.8 140 80.8-140H236.6z"></path><path class="lineal-stroke" d="M317.4 312.1c-4.1 0-7.9-2.2-9.9-5.7l-80.8-140c-3.2-5.5-1.3-12.5 4.2-15.6 1.7-1 3.7-1.5 5.7-1.5h161.6c6.3 0 11.4 5.1 11.4 11.4 0 2-.5 4-1.5 5.7l-80.8 140c-2.1 3.6-5.9 5.7-9.9 5.7zm-61-140l61 105.7 61-105.7h-122z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">loading</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/loading.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/loading.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 324 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/lock.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M14.3 241.7v197.5c0 32.3 26.2 58.5 58.5 58.5h178.4c32.3 0 58.5-26.2 58.5-58.5V241.7H14.3zM162 407.9c-26.3 0-47.7-21.4-47.7-47.7 0-26.3 21.4-47.7 47.7-47.7s47.7 21.4 47.7 47.7c0 26.3-21.4 47.7-47.7 47.7z"></path><path class="lineal-stroke" d="M251.2 512H72.8C32.6 512 0 479.4 0 439.2V241.7c0-7.9 6.4-14.3 14.3-14.3h295.4c7.9 0 14.3 6.4 14.3 14.3v197.5c0 40.2-32.6 72.7-72.8 72.8zM28.6 256v183.2c0 24.4 19.8 44.2 44.2 44.2h178.4c24.4 0 44.2-19.8 44.2-44.2V256H28.6zM162 422.2c-34.2 0-62-27.8-62-62s27.8-62 62-62 62 27.8 62 62-27.8 61.9-62 62zm0-95.4c-18.4 0-33.4 14.9-33.4 33.4 0 18.4 14.9 33.4 33.4 33.4s33.4-14.9 33.4-33.4-15-33.4-33.4-33.4z"></path><path class="lineal-stroke" d="M45.1 256c-7.9 0-14.3-6.4-14.3-14.3V124C30.9 55.6 86.4.1 154.8 0h14.3c68.4.1 123.9 55.6 124 124 0 7.9-6.4 14.3-14.3 14.3s-14.3-6.4-14.3-14.3c-.1-52.7-42.7-95.3-95.4-95.4h-14.3c-52.7.1-95.3 42.7-95.4 95.4v117.7c.1 7.9-6.3 14.3-14.3 14.3.1 0 0 0 0 0z"></path><path class="lineal-stroke" d="M68.6 234.5H20.4c-7.9 0-14.3-6.4-14.3-14.3s6.4-14.3 14.3-14.3h48.2c7.9 0 14.3 6.4 14.3 14.3-.1 7.9-6.5 14.3-14.3 14.3zm235 0h-48.2c-7.9 0-14.3-6.4-14.3-14.3s6.4-14.3 14.3-14.3h48.2c7.9 0 14.3 6.4 14.3 14.3s-6.4 14.3-14.3 14.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 324 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/lock.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M14.3 241.7v197.5c0 32.3 26.2 58.5 58.5 58.5h178.4c32.3 0 58.5-26.2 58.5-58.5V241.7H14.3zM162 407.9c-26.3 0-47.7-21.4-47.7-47.7 0-26.3 21.4-47.7 47.7-47.7s47.7 21.4 47.7 47.7c0 26.3-21.4 47.7-47.7 47.7z"></path><path class="lineal-stroke" d="M251.2 512H72.8C32.6 512 0 479.4 0 439.2V241.7c0-7.9 6.4-14.3 14.3-14.3h295.4c7.9 0 14.3 6.4 14.3 14.3v197.5c0 40.2-32.6 72.7-72.8 72.8zM28.6 256v183.2c0 24.4 19.8 44.2 44.2 44.2h178.4c24.4 0 44.2-19.8 44.2-44.2V256H28.6zM162 422.2c-34.2 0-62-27.8-62-62s27.8-62 62-62 62 27.8 62 62-27.8 61.9-62 62zm0-95.4c-18.4 0-33.4 14.9-33.4 33.4 0 18.4 14.9 33.4 33.4 33.4s33.4-14.9 33.4-33.4-15-33.4-33.4-33.4z"></path><path class="lineal-stroke" d="M45.1 256c-7.9 0-14.3-6.4-14.3-14.3V124C30.9 55.6 86.4.1 154.8 0h14.3c68.4.1 123.9 55.6 124 124 0 7.9-6.4 14.3-14.3 14.3s-14.3-6.4-14.3-14.3c-.1-52.7-42.7-95.3-95.4-95.4h-14.3c-52.7.1-95.3 42.7-95.4 95.4v117.7c.1 7.9-6.3 14.3-14.3 14.3.1 0 0 0 0 0z"></path><path class="lineal-stroke" d="M68.6 234.5H20.4c-7.9 0-14.3-6.4-14.3-14.3s6.4-14.3 14.3-14.3h48.2c7.9 0 14.3 6.4 14.3 14.3-.1 7.9-6.5 14.3-14.3 14.3zm235 0h-48.2c-7.9 0-14.3-6.4-14.3-14.3s6.4-14.3 14.3-14.3h48.2c7.9 0 14.3 6.4 14.3 14.3s-6.4 14.3-14.3 14.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">lock</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/lock.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/lock.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 403.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/login.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M300.86 202l-102.75-66.09v38.86H13v54.45h185.11v38.85z"></path><path class="lineal-stroke" d="M198.11 281.1a13 13 0 01-13-13v-25.86H13a13 13 0 01-13-13v-54.48a13 13 0 0113-13h172.09v-25.85a13 13 0 0120.07-11L307.9 191a13 13 0 010 21.91L205.16 279a13 13 0 01-7 2.07zM26.05 216.19h172.06a13 13 0 0113 13v15L276.78 202l-65.64-42.22v15a13 13 0 01-13 13H26.05z"></path><path class="lineal-stroke" d="M396.57 404H93.75a13 13 0 01-13-13v-65.93a13 13 0 0126 0v52.87h276.8V26.05H106.77v52.86a13 13 0 11-26 0V13a13 13 0 0113-13h302.8a13 13 0 0113 13v378a13 13 0 01-13 13z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 403.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/login.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M300.86 202l-102.75-66.09v38.86H13v54.45h185.11v38.85z"></path><path class="lineal-stroke" d="M198.11 281.1a13 13 0 01-13-13v-25.86H13a13 13 0 01-13-13v-54.48a13 13 0 0113-13h172.09v-25.85a13 13 0 0120.07-11L307.9 191a13 13 0 010 21.91L205.16 279a13 13 0 01-7 2.07zM26.05 216.19h172.06a13 13 0 0113 13v15L276.78 202l-65.64-42.22v15a13 13 0 01-13 13H26.05z"></path><path class="lineal-stroke" d="M396.57 404H93.75a13 13 0 01-13-13v-65.93a13 13 0 0126 0v52.87h276.8V26.05H106.77v52.86a13 13 0 11-26 0V13a13 13 0 0113-13h302.8a13 13 0 0113 13v378a13 13 0 01-13 13z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">login</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/login.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/login.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 385.59" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/logout.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M110.5 268.3a12.36 12.36 0 01-6.72-2L5.71 203.25a12.43 12.43 0 010-20.91l98.07-63.08a12.43 12.43 0 0119.15 10.46v24.65h164.23a12.44 12.44 0 0112.43 12.44v52a12.43 12.43 0 01-12.43 12.43H122.93v24.66a12.42 12.42 0 01-12.43 12.4z"></path><path class="lineal-fill" d="M35.41 192.8l62.66 40.29v-14.31a12.43 12.43 0 0112.43-12.43h164.23v-27.11H110.5a12.44 12.44 0 01-12.43-12.44v-14.3z"></path><path class="lineal-stroke" d="M397.17 385.59h-289a12.44 12.44 0 01-12.47-12.43v-62.89a12.43 12.43 0 0124.86 0v50.46h264.18V24.86H120.56v50.46a12.43 12.43 0 01-24.86 0V12.43A12.44 12.44 0 01108.13 0h289a12.44 12.44 0 0112.47 12.43v360.73a12.42 12.42 0 01-12.43 12.43z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 385.59" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/logout.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M110.5 268.3a12.36 12.36 0 01-6.72-2L5.71 203.25a12.43 12.43 0 010-20.91l98.07-63.08a12.43 12.43 0 0119.15 10.46v24.65h164.23a12.44 12.44 0 0112.43 12.44v52a12.43 12.43 0 01-12.43 12.43H122.93v24.66a12.42 12.42 0 01-12.43 12.4z"></path><path class="lineal-fill" d="M35.41 192.8l62.66 40.29v-14.31a12.43 12.43 0 0112.43-12.43h164.23v-27.11H110.5a12.44 12.44 0 01-12.43-12.44v-14.3z"></path><path class="lineal-stroke" d="M397.17 385.59h-289a12.44 12.44 0 01-12.47-12.43v-62.89a12.43 12.43 0 0124.86 0v50.46h264.18V24.86H120.56v50.46a12.43 12.43 0 01-24.86 0V12.43A12.44 12.44 0 01108.13 0h289a12.44 12.44 0 0112.47 12.43v360.73a12.42 12.42 0 01-12.43 12.43z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">logout</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/logout.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/logout.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/loss.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M449.87 151.95l33.06 123.38-123.38-33.06 90.32-90.32z"></path><path class="lineal-stroke" d="M497.89 270.25L465.1 147.87a15.76 15.76 0 00-26.38-7.07l-12.05 12-80.59-80.55a15.78 15.78 0 00-22.31 0l-43.92 43.93a15.76 15.76 0 000 22.3L338.33 197a15.77 15.77 0 1022.3-22.3l-47.33-47.37 21.62-21.63 69.44 69.45-56 56a15.77 15.77 0 007.07 26.38l123.38 33.06a15.83 15.83 0 004.08.54h.19a15.77 15.77 0 0015.62-15.77 15.51 15.51 0 00-.81-5.11zM390 234.11l51.69-51.69L460.62 253z"></path><path class="lineal-fill" d="M274.03 367.39h77.99v128.84h-77.99z"></path><path class="lineal-stroke" d="M496.23 416h-78a15.77 15.77 0 100 31.54h62.22v32.88H367.8V367.39a15.78 15.78 0 00-15.8-15.77h-78a15.77 15.77 0 00-15.77 15.77v113.07h-34.64V273.35a15.77 15.77 0 00-15.77-15.77h-78a15.77 15.77 0 00-15.77 15.77v134a15.77 15.77 0 1031.54 0V289.12h46.45v191.34H31.54V15.77a15.77 15.77 0 00-31.54 0v480.46A15.77 15.77 0 0015.77 512h480.46A15.77 15.77 0 00512 496.23v-64.42A15.77 15.77 0 00496.23 416zM289.8 480.46v-97.29h46.45v97.29z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/loss.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M449.87 151.95l33.06 123.38-123.38-33.06 90.32-90.32z"></path><path class="lineal-stroke" d="M497.89 270.25L465.1 147.87a15.76 15.76 0 00-26.38-7.07l-12.05 12-80.59-80.55a15.78 15.78 0 00-22.31 0l-43.92 43.93a15.76 15.76 0 000 22.3L338.33 197a15.77 15.77 0 1022.3-22.3l-47.33-47.37 21.62-21.63 69.44 69.45-56 56a15.77 15.77 0 007.07 26.38l123.38 33.06a15.83 15.83 0 004.08.54h.19a15.77 15.77 0 0015.62-15.77 15.51 15.51 0 00-.81-5.11zM390 234.11l51.69-51.69L460.62 253z"></path><path class="lineal-fill" d="M274.03 367.39h77.99v128.84h-77.99z"></path><path class="lineal-stroke" d="M496.23 416h-78a15.77 15.77 0 100 31.54h62.22v32.88H367.8V367.39a15.78 15.78 0 00-15.8-15.77h-78a15.77 15.77 0 00-15.77 15.77v113.07h-34.64V273.35a15.77 15.77 0 00-15.77-15.77h-78a15.77 15.77 0 00-15.77 15.77v134a15.77 15.77 0 1031.54 0V289.12h46.45v191.34H31.54V15.77a15.77 15.77 0 00-31.54 0v480.46A15.77 15.77 0 0015.77 512h480.46A15.77 15.77 0 00512 496.23v-64.42A15.77 15.77 0 00496.23 416zM289.8 480.46v-97.29h46.45v97.29z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">loss</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/loss.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/loss.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 457.97" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/loyalty.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M286.5 180.78c-18.21 0-26.38 10.21-29.59 16.2a1.08 1.08 0 01-1.9 0c-3.21-6-11.33-16.2-29.54-16.2-20.74 0-39 14.16-39 40a54.24 54.24 0 008 29.43c12.06 20.38 51.78 46.81 59.94 52a2.74 2.74 0 003 0c8.16-5.18 47.9-31.48 60.05-52a54.22 54.22 0 008-29.43c.05-25.84-18.22-40-38.96-40z"></path><path class="lineal-stroke" d="M256 316.82a16.91 16.91 0 01-9.09-2.65c-8.3-5.3-50.43-32.93-64.51-56.74a68.28 68.28 0 01-10-36.64c0-31.38 22.34-54.16 53.13-54.16 13.91 0 23.74 4.56 30.5 9.92 6.76-5.36 16.61-9.92 30.53-9.92 30.81 0 53.16 22.78 53.16 54.16a68.25 68.25 0 01-10 36.64c-14.19 24-56.34 51.49-64.65 56.76a16.86 16.86 0 01-9.07 2.63zm-30.53-121.88c-11.45 0-24.83 6.77-24.83 25.85a40.3 40.3 0 006.08 22.21c7.43 12.57 31.56 31.35 49.25 43.27 17.69-11.87 41.84-30.61 49.33-43.27a40.38 40.38 0 006.06-22.22c0-19.08-13.39-25.86-24.86-25.86-8.25 0-14 2.94-17.12 8.74a15.24 15.24 0 01-26.86 0c-3.09-5.79-8.82-8.72-17.05-8.72z"></path><path class="lineal-stroke" d="M130.67 458c-8.1 0-19.71-3.73-44.41-31.37C74.07 413 64.07 399.53 63.65 399a14.32 14.32 0 01-1-1.56A58.57 58.57 0 0155.29 369v-67.66a14.15 14.15 0 0114.15-14.15h86.46a50 50 0 0135.31 14.46l44.27 43.56a36.25 36.25 0 11-51.18 51.34L141 353.28l-9.66-.06a14.16 14.16 0 01.08-28.31h.07c5.35 0 9.26.06 11.84.09 5.33.07 9.54.13 13.67 4.25l47.28 47.29a7.94 7.94 0 0011.23-11.24l-44.18-43.48a21.93 21.93 0 00-15.46-6.33H83.59V369A30.14 30.14 0 0087 382.9c16.91 22.62 37.33 44.05 44.52 46.77h115c7.14 0 15.91-4 24.27-8 6.87-3.33 59.31-38.81 94.36-62.95.24-.16.48-.32.73-.46a9.49 9.49 0 003.22-13 9.47 9.47 0 00-12.79-3.34l-64.07 42.48a14.15 14.15 0 11-15.64-23.58l64.4-42.73.52-.33a37.77 37.77 0 0139.39 64.46c-15.12 10.41-86.6 59.5-97.77 64.9S259.62 458 246.49 458H130.67z"></path><path class="lineal-fill" d="M14.15 288.21h73.13v141.2H14.15z"></path><path class="lineal-stroke" d="M87.28 443.56H14.15A14.16 14.16 0 010 429.41v-141.2a14.15 14.15 0 0114.15-14.15h73.13a14.14 14.14 0 0114.15 14.15v141.2a14.15 14.15 0 01-14.15 14.15zm-59-28.31h44.85V302.36H28.3zm414.28-244.46h-86.45a50.09 50.09 0 01-35.32-14.46l-44.27-43.56a36.25 36.25 0 1151.19-51.35L371 104.69l9.66.07a14.15 14.15 0 01-.07 28.3h-.08c-5.34 0-9.25-.06-11.84-.09-5.33-.07-9.54-.12-13.66-4.25l-47.32-47.28a7.94 7.94 0 00-11.23 11.23l44.18 43.48a21.93 21.93 0 0015.46 6.33h72.3V88.94a30.13 30.13 0 00-3.4-13.87C408.11 52.45 387.69 31 380.5 28.3h-115c-7.14 0-15.91 4-24.28 8-6.86 3.33-59.3 38.82-94.35 63-.24.16-.48.32-.73.47a9.47 9.47 0 009.56 16.34l64.09-42.51a14.15 14.15 0 0115.64 23.59l-64.38 42.7-.52.32a37.77 37.77 0 01-39.39-64.46c15.11-10.4 86.6-59.49 97.77-64.9C240.23 5.37 252.38 0 265.51 0h115.81c8.1 0 19.72 3.73 44.41 31.37C437.94 45 447.93 58.44 448.35 59a14.32 14.32 0 011 1.56 58.57 58.57 0 017.35 28.37v67.69a14.16 14.16 0 01-14.14 14.17z"></path><path class="lineal-fill" d="M424.72 28.56h73.13v141.2h-73.13z"></path><path class="lineal-stroke" d="M497.85 183.92h-73.13a14.15 14.15 0 01-14.15-14.16V28.56a14.15 14.15 0 0114.15-14.15h73.13A14.16 14.16 0 01512 28.56v141.2a14.16 14.16 0 01-14.15 14.16zm-59-28.31h44.85V42.72h-44.83z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 457.97" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/loyalty.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M286.5 180.78c-18.21 0-26.38 10.21-29.59 16.2a1.08 1.08 0 01-1.9 0c-3.21-6-11.33-16.2-29.54-16.2-20.74 0-39 14.16-39 40a54.24 54.24 0 008 29.43c12.06 20.38 51.78 46.81 59.94 52a2.74 2.74 0 003 0c8.16-5.18 47.9-31.48 60.05-52a54.22 54.22 0 008-29.43c.05-25.84-18.22-40-38.96-40z"></path><path class="lineal-stroke" d="M256 316.82a16.91 16.91 0 01-9.09-2.65c-8.3-5.3-50.43-32.93-64.51-56.74a68.28 68.28 0 01-10-36.64c0-31.38 22.34-54.16 53.13-54.16 13.91 0 23.74 4.56 30.5 9.92 6.76-5.36 16.61-9.92 30.53-9.92 30.81 0 53.16 22.78 53.16 54.16a68.25 68.25 0 01-10 36.64c-14.19 24-56.34 51.49-64.65 56.76a16.86 16.86 0 01-9.07 2.63zm-30.53-121.88c-11.45 0-24.83 6.77-24.83 25.85a40.3 40.3 0 006.08 22.21c7.43 12.57 31.56 31.35 49.25 43.27 17.69-11.87 41.84-30.61 49.33-43.27a40.38 40.38 0 006.06-22.22c0-19.08-13.39-25.86-24.86-25.86-8.25 0-14 2.94-17.12 8.74a15.24 15.24 0 01-26.86 0c-3.09-5.79-8.82-8.72-17.05-8.72z"></path><path class="lineal-stroke" d="M130.67 458c-8.1 0-19.71-3.73-44.41-31.37C74.07 413 64.07 399.53 63.65 399a14.32 14.32 0 01-1-1.56A58.57 58.57 0 0155.29 369v-67.66a14.15 14.15 0 0114.15-14.15h86.46a50 50 0 0135.31 14.46l44.27 43.56a36.25 36.25 0 11-51.18 51.34L141 353.28l-9.66-.06a14.16 14.16 0 01.08-28.31h.07c5.35 0 9.26.06 11.84.09 5.33.07 9.54.13 13.67 4.25l47.28 47.29a7.94 7.94 0 0011.23-11.24l-44.18-43.48a21.93 21.93 0 00-15.46-6.33H83.59V369A30.14 30.14 0 0087 382.9c16.91 22.62 37.33 44.05 44.52 46.77h115c7.14 0 15.91-4 24.27-8 6.87-3.33 59.31-38.81 94.36-62.95.24-.16.48-.32.73-.46a9.49 9.49 0 003.22-13 9.47 9.47 0 00-12.79-3.34l-64.07 42.48a14.15 14.15 0 11-15.64-23.58l64.4-42.73.52-.33a37.77 37.77 0 0139.39 64.46c-15.12 10.41-86.6 59.5-97.77 64.9S259.62 458 246.49 458H130.67z"></path><path class="lineal-fill" d="M14.15 288.21h73.13v141.2H14.15z"></path><path class="lineal-stroke" d="M87.28 443.56H14.15A14.16 14.16 0 010 429.41v-141.2a14.15 14.15 0 0114.15-14.15h73.13a14.14 14.14 0 0114.15 14.15v141.2a14.15 14.15 0 01-14.15 14.15zm-59-28.31h44.85V302.36H28.3zm414.28-244.46h-86.45a50.09 50.09 0 01-35.32-14.46l-44.27-43.56a36.25 36.25 0 1151.19-51.35L371 104.69l9.66.07a14.15 14.15 0 01-.07 28.3h-.08c-5.34 0-9.25-.06-11.84-.09-5.33-.07-9.54-.12-13.66-4.25l-47.32-47.28a7.94 7.94 0 00-11.23 11.23l44.18 43.48a21.93 21.93 0 0015.46 6.33h72.3V88.94a30.13 30.13 0 00-3.4-13.87C408.11 52.45 387.69 31 380.5 28.3h-115c-7.14 0-15.91 4-24.28 8-6.86 3.33-59.3 38.82-94.35 63-.24.16-.48.32-.73.47a9.47 9.47 0 009.56 16.34l64.09-42.51a14.15 14.15 0 0115.64 23.59l-64.38 42.7-.52.32a37.77 37.77 0 01-39.39-64.46c15.11-10.4 86.6-59.49 97.77-64.9C240.23 5.37 252.38 0 265.51 0h115.81c8.1 0 19.72 3.73 44.41 31.37C437.94 45 447.93 58.44 448.35 59a14.32 14.32 0 011 1.56 58.57 58.57 0 017.35 28.37v67.69a14.16 14.16 0 01-14.14 14.17z"></path><path class="lineal-fill" d="M424.72 28.56h73.13v141.2h-73.13z"></path><path class="lineal-stroke" d="M497.85 183.92h-73.13a14.15 14.15 0 01-14.15-14.16V28.56a14.15 14.15 0 0114.15-14.15h73.13A14.16 14.16 0 01512 28.56v141.2a14.16 14.16 0 01-14.15 14.16zm-59-28.31h44.85V42.72h-44.83z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">loyalty</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/loyalty.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/loyalty.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 474.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/map.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M336.4 392.2l-160.8 67.2V81.9l160.8-67.2z"></path><path class="lineal-stroke" d="M497.2 163.3c-8.1 0-14.7 6.6-14.8 14.7v223l-131.3-21.3V32.1l143.7 23.3c8.1 1.1 15.5-4.5 16.6-12.6 1.1-7.8-4.2-15.1-11.9-16.5L338.8.2h-.5l-.8-.2h-1.7c-.4 0-.8.1-1.2.1h-.5c-1.1.2-2.3.5-3.3.9h-.1L175 66.1 19.5 13.2C11.8 10.6 3.4 14.7.8 22.4c-.5 1.5-.8 3.1-.8 4.7v377.5c-.2 8.1 6.2 14.9 14.4 15.1s14.9-6.2 15.1-14.4V47.8l131.3 44.7v366.9c0 .6 0 1.1.1 1.7 0 .2 0 .3.1.5.1.4.1.8.2 1.2l.1.5c.1.4.2.8.4 1.2 0 .1.1.3.1.4.2.5.4 1 .7 1.5.3.5.6 1 .9 1.4l.3.3c.2.3.5.6.8 1 .1.1.2.3.4.4.3.3.6.6.9.8.1.1.2.2.4.3.4.4.9.7 1.3 1h.1c.5.3 1.1.7 1.7.9l.3.2c.6.3 1.2.5 1.9.7h.1c.6.2 1.2.3 1.8.4l.4.1c.6.1 1.3.1 1.9.1.5 0 1 0 1.5-.1.3 0 .7-.1 1-.1l.4-.1c.4-.1.9-.2 1.3-.3h.1c.5-.2 1-.3 1.5-.5l156.8-65.5L495 432.9c.8.1 1.6.2 2.4.2 8.1 0 14.8-6.6 14.8-14.8V178c-.2-8.1-6.8-14.7-15-14.7zM190.3 91.7l131.3-54.8v345.5l-131.3 54.8V91.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 474.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/map.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M336.4 392.2l-160.8 67.2V81.9l160.8-67.2z"></path><path class="lineal-stroke" d="M497.2 163.3c-8.1 0-14.7 6.6-14.8 14.7v223l-131.3-21.3V32.1l143.7 23.3c8.1 1.1 15.5-4.5 16.6-12.6 1.1-7.8-4.2-15.1-11.9-16.5L338.8.2h-.5l-.8-.2h-1.7c-.4 0-.8.1-1.2.1h-.5c-1.1.2-2.3.5-3.3.9h-.1L175 66.1 19.5 13.2C11.8 10.6 3.4 14.7.8 22.4c-.5 1.5-.8 3.1-.8 4.7v377.5c-.2 8.1 6.2 14.9 14.4 15.1s14.9-6.2 15.1-14.4V47.8l131.3 44.7v366.9c0 .6 0 1.1.1 1.7 0 .2 0 .3.1.5.1.4.1.8.2 1.2l.1.5c.1.4.2.8.4 1.2 0 .1.1.3.1.4.2.5.4 1 .7 1.5.3.5.6 1 .9 1.4l.3.3c.2.3.5.6.8 1 .1.1.2.3.4.4.3.3.6.6.9.8.1.1.2.2.4.3.4.4.9.7 1.3 1h.1c.5.3 1.1.7 1.7.9l.3.2c.6.3 1.2.5 1.9.7h.1c.6.2 1.2.3 1.8.4l.4.1c.6.1 1.3.1 1.9.1.5 0 1 0 1.5-.1.3 0 .7-.1 1-.1l.4-.1c.4-.1.9-.2 1.3-.3h.1c.5-.2 1-.3 1.5-.5l156.8-65.5L495 432.9c.8.1 1.6.2 2.4.2 8.1 0 14.8-6.6 14.8-14.8V178c-.2-8.1-6.8-14.7-15-14.7zM190.3 91.7l131.3-54.8v345.5l-131.3 54.8V91.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">map</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/map.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/map.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 502.81 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/maximize.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M462.11 512H193a14.6 14.6 0 010-29.2h269.1a11.52 11.52 0 0011.51-11.5V125.59a11.53 11.53 0 00-11.51-11.51H125.59a11.52 11.52 0 00-11.51 11.51 14.6 14.6 0 11-29.2 0 40.75 40.75 0 0140.71-40.71h336.52a40.74 40.74 0 0140.7 40.71V471.3a40.74 40.74 0 01-40.7 40.7z"></path><path class="lineal-fill" d="M125.59 99.48h277.74V40.7a26.11 26.11 0 00-26.11-26.1H40.7a26.11 26.11 0 00-26.1 26.1v345.71a26.11 26.11 0 0026.1 26.11h58.78V125.59a26.11 26.11 0 0126.11-26.11z"></path><path class="lineal-stroke" d="M99.48 427.12H40.7A40.75 40.75 0 010 386.41V40.7A40.75 40.75 0 0140.7 0h336.52a40.75 40.75 0 0140.71 40.7v58.78a14.6 14.6 0 01-14.6 14.6H125.59a11.53 11.53 0 00-11.51 11.51v286.93a14.6 14.6 0 01-14.6 14.6zM40.7 29.2a11.51 11.51 0 00-11.5 11.5v345.71a11.52 11.52 0 0011.5 11.51h44.18V125.59a40.75 40.75 0 0140.71-40.71h263.14V40.7a11.51 11.51 0 00-11.5-11.5zm165.51 371.47a14.61 14.61 0 01-10.33-24.93L373.63 198a14.6 14.6 0 1120.64 20.65L216.53 396.39a14.56 14.56 0 01-10.32 4.28z"></path><path class="lineal-stroke" d="M386.35 303a14.6 14.6 0 01-14.46-16.76l11.57-77.47L306 220.39a14.6 14.6 0 11-4.31-28.88l97-14.49a14.59 14.59 0 0116.59 16.59l-14.48 97A14.6 14.6 0 01386.35 303zM186.88 420a14.6 14.6 0 01-14.44-16.76l14.49-97a14.6 14.6 0 0128.88 4.31L204.23 388l77.48-11.58a14.6 14.6 0 014.29 28.92l-97 14.49a14.28 14.28 0 01-2.12.17z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 502.81 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/maximize.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M462.11 512H193a14.6 14.6 0 010-29.2h269.1a11.52 11.52 0 0011.51-11.5V125.59a11.53 11.53 0 00-11.51-11.51H125.59a11.52 11.52 0 00-11.51 11.51 14.6 14.6 0 11-29.2 0 40.75 40.75 0 0140.71-40.71h336.52a40.74 40.74 0 0140.7 40.71V471.3a40.74 40.74 0 01-40.7 40.7z"></path><path class="lineal-fill" d="M125.59 99.48h277.74V40.7a26.11 26.11 0 00-26.11-26.1H40.7a26.11 26.11 0 00-26.1 26.1v345.71a26.11 26.11 0 0026.1 26.11h58.78V125.59a26.11 26.11 0 0126.11-26.11z"></path><path class="lineal-stroke" d="M99.48 427.12H40.7A40.75 40.75 0 010 386.41V40.7A40.75 40.75 0 0140.7 0h336.52a40.75 40.75 0 0140.71 40.7v58.78a14.6 14.6 0 01-14.6 14.6H125.59a11.53 11.53 0 00-11.51 11.51v286.93a14.6 14.6 0 01-14.6 14.6zM40.7 29.2a11.51 11.51 0 00-11.5 11.5v345.71a11.52 11.52 0 0011.5 11.51h44.18V125.59a40.75 40.75 0 0140.71-40.71h263.14V40.7a11.51 11.51 0 00-11.5-11.5zm165.51 371.47a14.61 14.61 0 01-10.33-24.93L373.63 198a14.6 14.6 0 1120.64 20.65L216.53 396.39a14.56 14.56 0 01-10.32 4.28z"></path><path class="lineal-stroke" d="M386.35 303a14.6 14.6 0 01-14.46-16.76l11.57-77.47L306 220.39a14.6 14.6 0 11-4.31-28.88l97-14.49a14.59 14.59 0 0116.59 16.59l-14.48 97A14.6 14.6 0 01386.35 303zM186.88 420a14.6 14.6 0 01-14.44-16.76l14.49-97a14.6 14.6 0 0128.88 4.31L204.23 388l77.48-11.58a14.6 14.6 0 014.29 28.92l-97 14.49a14.28 14.28 0 01-2.12.17z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">maximize</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/maximize.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/maximize.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 316.5 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/medal.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M158.2 409.6c-59.4 0-107.5-48.2-107.5-107.5S99 194.6 158.3 194.6s107.5 48.2 107.5 107.5c0 20-5.6 39.6-16.1 56.6-3.4 5.5-10.6 7.1-16 3.7s-7.1-10.6-3.7-16c24.4-39.5 12.2-91.3-27.3-115.8S111.3 218.5 86.8 258s-12.2 91.3 27.3 115.8c22.5 13.9 50.2 16.4 74.8 6.8 6-2.3 12.7.6 15.1 6.6 2.3 6-.6 12.7-6.6 15.1-12.5 4.8-25.8 7.3-39.2 7.3z"></path><path class="lineal-fill" d="M158.2 206.2c19.9 0 39.4 6.2 55.6 17.8l88.1-152.5c4.6-8 3.7-18-2.2-25l-23-27.1c-4.1-4.9-10.2-7.7-16.6-7.7H56.4c-6.4 0-12.5 2.8-16.6 7.7l-23 27.2c-6 7-6.9 17-2.2 25l88 152.4c16.2-11.6 35.7-17.8 55.6-17.8zm73.4-134l-73.3 127-73.4-127h146.7z"></path><path class="lineal-stroke" d="M213.8 235.6c-2.4 0-4.8-.8-6.8-2.2-29.2-20.8-68.5-20.8-97.7 0-5.2 3.7-12.5 2.5-16.2-2.7l-.6-.9-88-152.5c-7-12.2-5.7-27.5 3.4-38.3l23-27.2C37.2 4.3 46.6 0 56.4 0h203.7c9.8 0 19.2 4.3 25.5 11.8l23 27.1c9.1 10.8 10.5 26.1 3.4 38.3l-88.1 152.5c-1.6 2.8-4.4 4.9-7.6 5.6-.8.2-1.6.3-2.5.3zM56.4 23.3c-3 0-5.8 1.3-7.8 3.6L25.7 54c-2.8 3.3-3.2 7.9-1 11.7l82.1 142c11.2-6.1 23.4-10.2 36-12.1L74.8 78c-3.2-5.6-1.3-12.7 4.3-15.9 1.8-1 3.8-1.6 5.8-1.6h146.7c6.4 0 11.6 5.2 11.6 11.7 0 2-.5 4-1.6 5.8l-67.9 117.7c12.6 1.8 24.8 5.9 36 12.1l82-142c2.1-3.7 1.7-8.4-1-11.6l-23-27.2c-1.9-2.3-4.8-3.6-7.7-3.6l-203.6-.1zm48.7 60.5l53.2 92.1 53.2-92.1H105.1zm45.1 192.9l-4.4 2.7c-1.1.8-2.4 1.2-3.8 1.2-4.4 0-7.4-4.7-7.4-9.4-.1-3.3 1.6-6.3 4.4-8l20-12.1c1.3-.8 2.9-1.1 4.4-1.1 4.8 0 10.4 2.9 10.4 7.4v96.2c0 4.9-5.9 7.3-11.8 7.3s-11.8-2.4-11.8-7.3v-76.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 316.5 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/medal.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M158.2 409.6c-59.4 0-107.5-48.2-107.5-107.5S99 194.6 158.3 194.6s107.5 48.2 107.5 107.5c0 20-5.6 39.6-16.1 56.6-3.4 5.5-10.6 7.1-16 3.7s-7.1-10.6-3.7-16c24.4-39.5 12.2-91.3-27.3-115.8S111.3 218.5 86.8 258s-12.2 91.3 27.3 115.8c22.5 13.9 50.2 16.4 74.8 6.8 6-2.3 12.7.6 15.1 6.6 2.3 6-.6 12.7-6.6 15.1-12.5 4.8-25.8 7.3-39.2 7.3z"></path><path class="lineal-fill" d="M158.2 206.2c19.9 0 39.4 6.2 55.6 17.8l88.1-152.5c4.6-8 3.7-18-2.2-25l-23-27.1c-4.1-4.9-10.2-7.7-16.6-7.7H56.4c-6.4 0-12.5 2.8-16.6 7.7l-23 27.2c-6 7-6.9 17-2.2 25l88 152.4c16.2-11.6 35.7-17.8 55.6-17.8zm73.4-134l-73.3 127-73.4-127h146.7z"></path><path class="lineal-stroke" d="M213.8 235.6c-2.4 0-4.8-.8-6.8-2.2-29.2-20.8-68.5-20.8-97.7 0-5.2 3.7-12.5 2.5-16.2-2.7l-.6-.9-88-152.5c-7-12.2-5.7-27.5 3.4-38.3l23-27.2C37.2 4.3 46.6 0 56.4 0h203.7c9.8 0 19.2 4.3 25.5 11.8l23 27.1c9.1 10.8 10.5 26.1 3.4 38.3l-88.1 152.5c-1.6 2.8-4.4 4.9-7.6 5.6-.8.2-1.6.3-2.5.3zM56.4 23.3c-3 0-5.8 1.3-7.8 3.6L25.7 54c-2.8 3.3-3.2 7.9-1 11.7l82.1 142c11.2-6.1 23.4-10.2 36-12.1L74.8 78c-3.2-5.6-1.3-12.7 4.3-15.9 1.8-1 3.8-1.6 5.8-1.6h146.7c6.4 0 11.6 5.2 11.6 11.7 0 2-.5 4-1.6 5.8l-67.9 117.7c12.6 1.8 24.8 5.9 36 12.1l82-142c2.1-3.7 1.7-8.4-1-11.6l-23-27.2c-1.9-2.3-4.8-3.6-7.7-3.6l-203.6-.1zm48.7 60.5l53.2 92.1 53.2-92.1H105.1zm45.1 192.9l-4.4 2.7c-1.1.8-2.4 1.2-3.8 1.2-4.4 0-7.4-4.7-7.4-9.4-.1-3.3 1.6-6.3 4.4-8l20-12.1c1.3-.8 2.9-1.1 4.4-1.1 4.8 0 10.4 2.9 10.4 7.4v96.2c0 4.9-5.9 7.3-11.8 7.3s-11.8-2.4-11.8-7.3v-76.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">medal</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/medal.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/medal.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 461.58" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/meeting.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M138.37 119.2h41.75a49.25 49.25 0 0149.25 49.25v72.79H76.89v-72.79a49.24 49.24 0 0149.24-49.25h41.76m179.44 0h41.76a49.25 49.25 0 0149.25 49.25v72.79H285.85v-72.79a49.25 49.25 0 0149.25-49.25h41.76"></path><path class="lineal-stroke" d="M497.07 226.31h-43.8v-57.87a64.21 64.21 0 00-34.45-56.84 50 50 0 008.44-27.87V50.4a14.93 14.93 0 10-29.86 0v33.33a20.56 20.56 0 01-20.4 20.54h-29.84a20.56 20.56 0 01-20.37-20.54V50.4a20.57 20.57 0 0120.54-20.55h29.53a14.93 14.93 0 000-29.85h-29.53a50.45 50.45 0 00-50.39 50.4v33.33a50 50 0 008.43 27.87 64.23 64.23 0 00-34.45 56.84v57.87H244.3v-57.87a64.22 64.22 0 00-34.44-56.84 50.12 50.12 0 008.43-27.87V50.4a14.93 14.93 0 10-29.86 0v33.33a20.56 20.56 0 01-20.37 20.54h-29.87a20.57 20.57 0 01-20.37-20.54V50.4a20.57 20.57 0 0120.55-20.55h29.52a14.93 14.93 0 100-29.85h-29.52A50.46 50.46 0 0088 50.4v33.33a50.12 50.12 0 008.4 27.87A64.22 64.22 0 0062 168.45v57.87H15a14.93 14.93 0 100 29.85h28.28l56.61 194.65a14.92 14.92 0 0014.33 10.76h283.56a14.92 14.92 0 0014.33-10.76l37.26-128.1.07-.24c0-.14.06-.27.1-.41.08-.31.16-.62.22-.93s.08-.5.11-.75.07-.46.09-.69 0-.68 0-1v-.46c0-.37 0-.73-.06-1.1v-.41c0-.32-.09-.64-.14-.95s-.05-.36-.09-.54-.12-.46-.18-.69-.12-.5-.2-.74-.1-.27-.15-.4c-.11-.33-.22-.65-.36-1a1.76 1.76 0 01-.09-.2c-.17-.37-.34-.73-.54-1.09 0-.08-.09-.15-.14-.23-.19-.33-.38-.66-.6-1s-.29-.38-.43-.58-.27-.37-.41-.54-.52-.59-.79-.87l-.17-.18a12.21 12.21 0 00-.92-.84l-.14-.13c-.27-.22-.55-.42-.84-.63-.11-.07-.21-.16-.33-.24l-.68-.41-.59-.35-.51-.25c-.28-.13-.56-.27-.86-.39-.13-.06-.27-.1-.4-.15-.34-.13-.67-.25-1-.35h-.09l-.38-.1c-.32-.08-.64-.16-1-.22s-.49-.08-.73-.11-.47-.08-.71-.1-.67 0-1-.05H203.36a14.93 14.93 0 000 29.85h211.87l-28.66 98.53H125.43L74.37 256.17h422.7a14.93 14.93 0 000-29.86zm-405.26 0v-57.87a34.36 34.36 0 0134.32-34.32h12.07v53.56a14.93 14.93 0 0029.86 0v-53.55h12.07a34.36 34.36 0 0134.32 34.32v57.87zm209 0v-57.87a34.36 34.36 0 0134.32-34.32h12.07v53.56a14.93 14.93 0 0029.85 0v-53.55h12.07a34.36 34.36 0 0134.32 34.32v57.87z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 461.58" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/meeting.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M138.37 119.2h41.75a49.25 49.25 0 0149.25 49.25v72.79H76.89v-72.79a49.24 49.24 0 0149.24-49.25h41.76m179.44 0h41.76a49.25 49.25 0 0149.25 49.25v72.79H285.85v-72.79a49.25 49.25 0 0149.25-49.25h41.76"></path><path class="lineal-stroke" d="M497.07 226.31h-43.8v-57.87a64.21 64.21 0 00-34.45-56.84 50 50 0 008.44-27.87V50.4a14.93 14.93 0 10-29.86 0v33.33a20.56 20.56 0 01-20.4 20.54h-29.84a20.56 20.56 0 01-20.37-20.54V50.4a20.57 20.57 0 0120.54-20.55h29.53a14.93 14.93 0 000-29.85h-29.53a50.45 50.45 0 00-50.39 50.4v33.33a50 50 0 008.43 27.87 64.23 64.23 0 00-34.45 56.84v57.87H244.3v-57.87a64.22 64.22 0 00-34.44-56.84 50.12 50.12 0 008.43-27.87V50.4a14.93 14.93 0 10-29.86 0v33.33a20.56 20.56 0 01-20.37 20.54h-29.87a20.57 20.57 0 01-20.37-20.54V50.4a20.57 20.57 0 0120.55-20.55h29.52a14.93 14.93 0 100-29.85h-29.52A50.46 50.46 0 0088 50.4v33.33a50.12 50.12 0 008.4 27.87A64.22 64.22 0 0062 168.45v57.87H15a14.93 14.93 0 100 29.85h28.28l56.61 194.65a14.92 14.92 0 0014.33 10.76h283.56a14.92 14.92 0 0014.33-10.76l37.26-128.1.07-.24c0-.14.06-.27.1-.41.08-.31.16-.62.22-.93s.08-.5.11-.75.07-.46.09-.69 0-.68 0-1v-.46c0-.37 0-.73-.06-1.1v-.41c0-.32-.09-.64-.14-.95s-.05-.36-.09-.54-.12-.46-.18-.69-.12-.5-.2-.74-.1-.27-.15-.4c-.11-.33-.22-.65-.36-1a1.76 1.76 0 01-.09-.2c-.17-.37-.34-.73-.54-1.09 0-.08-.09-.15-.14-.23-.19-.33-.38-.66-.6-1s-.29-.38-.43-.58-.27-.37-.41-.54-.52-.59-.79-.87l-.17-.18a12.21 12.21 0 00-.92-.84l-.14-.13c-.27-.22-.55-.42-.84-.63-.11-.07-.21-.16-.33-.24l-.68-.41-.59-.35-.51-.25c-.28-.13-.56-.27-.86-.39-.13-.06-.27-.1-.4-.15-.34-.13-.67-.25-1-.35h-.09l-.38-.1c-.32-.08-.64-.16-1-.22s-.49-.08-.73-.11-.47-.08-.71-.1-.67 0-1-.05H203.36a14.93 14.93 0 000 29.85h211.87l-28.66 98.53H125.43L74.37 256.17h422.7a14.93 14.93 0 000-29.86zm-405.26 0v-57.87a34.36 34.36 0 0134.32-34.32h12.07v53.56a14.93 14.93 0 0029.86 0v-53.55h12.07a34.36 34.36 0 0134.32 34.32v57.87zm209 0v-57.87a34.36 34.36 0 0134.32-34.32h12.07v53.56a14.93 14.93 0 0029.85 0v-53.55h12.07a34.36 34.36 0 0134.32 34.32v57.87z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">meeting</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/meeting.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/meeting.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">megaphone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/megaphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/megaphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.59 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/menu.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M381.14 409.59h-122.9a28.48 28.48 0 01-28.45-28.45v-122.9a28.49 28.49 0 0128.45-28.45h73.33a12.42 12.42 0 110 24.84h-73.33a3.62 3.62 0 00-3.62 3.61v122.9a3.63 3.63 0 003.62 3.62h122.9a3.63 3.63 0 003.62-3.62v-61.45a12.42 12.42 0 1124.83 0v61.45a28.48 28.48 0 01-28.45 28.45z"></path><path class="lineal-fill" d="M12.42 151.35V28.46a16 16 0 0116-16h122.93a16 16 0 0116 16v122.89a16 16 0 01-16 16H28.46a16 16 0 01-16-16z"></path><path class="lineal-stroke" d="M151.35 179.81H28.46A28.5 28.5 0 010 151.35V28.46A28.5 28.5 0 0128.46 0h122.89a28.5 28.5 0 0128.46 28.46v122.89a28.5 28.5 0 01-28.46 28.46zM28.46 24.84a3.62 3.62 0 00-3.62 3.62v122.89a3.62 3.62 0 003.62 3.65h122.89a3.63 3.63 0 003.62-3.62V28.46a3.62 3.62 0 00-3.62-3.62z"></path><path class="lineal-fill" d="M242.21 151.35V28.46a16 16 0 0116-16h122.9a16 16 0 0116 16v122.89a16 16 0 01-16 16H258.24a16 16 0 01-16-16z"></path><path class="lineal-stroke" d="M381.14 179.81h-122.9a28.49 28.49 0 01-28.45-28.46V28.46A28.49 28.49 0 01258.24 0h122.9a28.49 28.49 0 0128.45 28.46v122.89a28.49 28.49 0 01-28.45 28.46zm-122.9-155a3.63 3.63 0 00-3.62 3.62v122.92a3.63 3.63 0 003.62 3.62h122.9a3.63 3.63 0 003.62-3.62V28.46a3.63 3.63 0 00-3.62-3.62z"></path><path class="lineal-fill" d="M12.42 381.15v-122.9a16 16 0 0116-16h122.93a16 16 0 0116 16v122.9a16 16 0 01-16 16H28.46a16 16 0 01-16-16z"></path><path class="lineal-stroke" d="M151.35 409.6H28.46A28.49 28.49 0 010 381.15v-122.9a28.5 28.5 0 0128.46-28.46h122.89a28.5 28.5 0 0128.46 28.46v122.9a28.49 28.49 0 01-28.46 28.45zm-122.89-155a3.62 3.62 0 00-3.62 3.62v122.9a3.62 3.62 0 003.62 3.61h122.89a3.62 3.62 0 003.62-3.61V258.25a3.62 3.62 0 00-3.62-3.62z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.59 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/menu.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M381.14 409.59h-122.9a28.48 28.48 0 01-28.45-28.45v-122.9a28.49 28.49 0 0128.45-28.45h73.33a12.42 12.42 0 110 24.84h-73.33a3.62 3.62 0 00-3.62 3.61v122.9a3.63 3.63 0 003.62 3.62h122.9a3.63 3.63 0 003.62-3.62v-61.45a12.42 12.42 0 1124.83 0v61.45a28.48 28.48 0 01-28.45 28.45z"></path><path class="lineal-fill" d="M12.42 151.35V28.46a16 16 0 0116-16h122.93a16 16 0 0116 16v122.89a16 16 0 01-16 16H28.46a16 16 0 01-16-16z"></path><path class="lineal-stroke" d="M151.35 179.81H28.46A28.5 28.5 0 010 151.35V28.46A28.5 28.5 0 0128.46 0h122.89a28.5 28.5 0 0128.46 28.46v122.89a28.5 28.5 0 01-28.46 28.46zM28.46 24.84a3.62 3.62 0 00-3.62 3.62v122.89a3.62 3.62 0 003.62 3.65h122.89a3.63 3.63 0 003.62-3.62V28.46a3.62 3.62 0 00-3.62-3.62z"></path><path class="lineal-fill" d="M242.21 151.35V28.46a16 16 0 0116-16h122.9a16 16 0 0116 16v122.89a16 16 0 01-16 16H258.24a16 16 0 01-16-16z"></path><path class="lineal-stroke" d="M381.14 179.81h-122.9a28.49 28.49 0 01-28.45-28.46V28.46A28.49 28.49 0 01258.24 0h122.9a28.49 28.49 0 0128.45 28.46v122.89a28.49 28.49 0 01-28.45 28.46zm-122.9-155a3.63 3.63 0 00-3.62 3.62v122.92a3.63 3.63 0 003.62 3.62h122.9a3.63 3.63 0 003.62-3.62V28.46a3.63 3.63 0 00-3.62-3.62z"></path><path class="lineal-fill" d="M12.42 381.15v-122.9a16 16 0 0116-16h122.93a16 16 0 0116 16v122.9a16 16 0 01-16 16H28.46a16 16 0 01-16-16z"></path><path class="lineal-stroke" d="M151.35 409.6H28.46A28.49 28.49 0 010 381.15v-122.9a28.5 28.5 0 0128.46-28.46h122.89a28.5 28.5 0 0128.46 28.46v122.9a28.49 28.49 0 01-28.46 28.45zm-122.89-155a3.62 3.62 0 00-3.62 3.62v122.9a3.62 3.62 0 003.62 3.61h122.89a3.62 3.62 0 003.62-3.61V258.25a3.62 3.62 0 00-3.62-3.62z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">menu</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/menu.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/menu.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 341.63 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/microphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M170.81 313.11A111.59 111.59 0 0159.34 201.65v-90.18A111.5 111.5 0 01274.28 70.1a14.29 14.29 0 11-26.52 10.67 82.86 82.86 0 00-159.83 30.7v90.17a82.88 82.88 0 00165.76 0 14.3 14.3 0 0128.59 0 111.59 111.59 0 01-111.47 111.47z"></path><path class="lineal-stroke" d="M170.81 372.46C76.63 372.46 0 295.83 0 201.65v-45.09a14.3 14.3 0 1128.59 0v45.09c0 78.42 63.8 142.22 142.22 142.22a14.3 14.3 0 110 28.59zM248 352.1a14.29 14.29 0 01-7.08-26.72A142.73 142.73 0 00313 201.64v-45.08a14.3 14.3 0 1128.59 0v45.08A171.37 171.37 0 01255 350.23a14.21 14.21 0 01-7 1.87z"></path><path class="lineal-fill" d="M73.64 156.56v45.09c0 53.44 43.73 97.17 97.17 97.17 53.45 0 97.18-43.73 97.18-97.17v-45.09z"></path><path class="lineal-stroke" d="M170.81 313.11A111.59 111.59 0 0159.34 201.65v-45.09a14.3 14.3 0 0114.3-14.3H268a14.29 14.29 0 0114.29 14.3v45.09a111.59 111.59 0 01-111.48 111.46zM87.93 170.85v30.79a82.88 82.88 0 00165.76 0v-30.79zm82.88 305.54a14.29 14.29 0 01-14.29-14.29V358.16a14.3 14.3 0 0128.59 0V462.1a14.29 14.29 0 01-14.3 14.29z"></path><path class="lineal-fill" d="M256.05 497.71H85.57a31.9 31.9 0 01-31.89-31.9 31.9 31.9 0 0131.89-31.9h170.48a31.9 31.9 0 0131.9 31.9 31.9 31.9 0 01-31.9 31.9z"></path><path class="lineal-stroke" d="M256.05 512H85.57a46.19 46.19 0 110-92.38h170.48a46.19 46.19 0 010 92.38zM85.57 448.21a17.6 17.6 0 100 35.2h170.48a17.6 17.6 0 100-35.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 341.63 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/microphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M170.81 313.11A111.59 111.59 0 0159.34 201.65v-90.18A111.5 111.5 0 01274.28 70.1a14.29 14.29 0 11-26.52 10.67 82.86 82.86 0 00-159.83 30.7v90.17a82.88 82.88 0 00165.76 0 14.3 14.3 0 0128.59 0 111.59 111.59 0 01-111.47 111.47z"></path><path class="lineal-stroke" d="M170.81 372.46C76.63 372.46 0 295.83 0 201.65v-45.09a14.3 14.3 0 1128.59 0v45.09c0 78.42 63.8 142.22 142.22 142.22a14.3 14.3 0 110 28.59zM248 352.1a14.29 14.29 0 01-7.08-26.72A142.73 142.73 0 00313 201.64v-45.08a14.3 14.3 0 1128.59 0v45.08A171.37 171.37 0 01255 350.23a14.21 14.21 0 01-7 1.87z"></path><path class="lineal-fill" d="M73.64 156.56v45.09c0 53.44 43.73 97.17 97.17 97.17 53.45 0 97.18-43.73 97.18-97.17v-45.09z"></path><path class="lineal-stroke" d="M170.81 313.11A111.59 111.59 0 0159.34 201.65v-45.09a14.3 14.3 0 0114.3-14.3H268a14.29 14.29 0 0114.29 14.3v45.09a111.59 111.59 0 01-111.48 111.46zM87.93 170.85v30.79a82.88 82.88 0 00165.76 0v-30.79zm82.88 305.54a14.29 14.29 0 01-14.29-14.29V358.16a14.3 14.3 0 0128.59 0V462.1a14.29 14.29 0 01-14.3 14.29z"></path><path class="lineal-fill" d="M256.05 497.71H85.57a31.9 31.9 0 01-31.89-31.9 31.9 31.9 0 0131.89-31.9h170.48a31.9 31.9 0 0131.9 31.9 31.9 31.9 0 01-31.9 31.9z"></path><path class="lineal-stroke" d="M256.05 512H85.57a46.19 46.19 0 110-92.38h170.48a46.19 46.19 0 010 92.38zM85.57 448.21a17.6 17.6 0 100 35.2h170.48a17.6 17.6 0 100-35.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">microphone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/microphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/microphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/minimize.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M457.26 512a13.88 13.88 0 01-9.83-4.07L322.92 383.42a13.9 13.9 0 0119.65-19.66l114.69 114.69 20-20-33.13-33.13a13.89 13.89 0 1119.65-19.65l43 43a13.89 13.89 0 010 19.65l-39.62 39.62a13.86 13.86 0 01-9.9 4.06z"></path><path class="lineal-fill" d="M338.65 449.29l-33.46-144.1 144.1 33.46-110.64 110.64z"></path><path class="lineal-stroke" d="M338.65 463.18a13.51 13.51 0 01-3.82-.54 13.86 13.86 0 01-9.72-10.21l-33.46-144.1a13.9 13.9 0 0116.68-16.68l144.1 33.46a13.89 13.89 0 016.68 23.36L348.48 459.11a13.93 13.93 0 01-9.83 4.07zm-14.89-139.41l22.76 98 75.24-75.24zM179.25 152.3a13.8 13.8 0 01-9.82-4.07L54.74 33.55l-20 20 33.17 33.1a13.89 13.89 0 01-19.65 19.65l-43-43a13.89 13.89 0 010-19.65L44.92 4.07a13.89 13.89 0 0119.65 0l124.51 124.51a13.9 13.9 0 01-9.83 23.72z"></path><path class="lineal-fill" d="M173.35 62.71l33.46 144.1-144.1-33.46L173.35 62.71z"></path><path class="lineal-stroke" d="M206.81 220.71a14 14 0 01-3.14-.36l-144.1-33.46a13.9 13.9 0 01-6.68-23.37L163.52 52.89a13.89 13.89 0 0123.36 6.68l33.26 143.21A13.89 13.89 0 01207 220.71zM90.24 165.48l98 22.75-22.75-98zM53.51 510.77a13.86 13.86 0 01-9.82-4.07L4.07 467.08a13.89 13.89 0 010-19.65l124.51-124.51a13.89 13.89 0 0119.65 19.65L33.55 457.26l20 20 33.14-33.14a13.9 13.9 0 1119.65 19.66l-43 43a13.86 13.86 0 01-9.83 3.99z"></path><path class="lineal-fill" d="M62.71 338.65l144.1-33.46-33.46 144.1L62.71 338.65z"></path><path class="lineal-stroke" d="M173.35 463.18a13.93 13.93 0 01-9.83-4.07L52.89 348.47a13.89 13.89 0 016.68-23.36l144.1-33.46a13.9 13.9 0 0116.68 16.68l-33.46 144.1a13.87 13.87 0 01-13.54 10.75zM90.24 346.52l75.24 75.24 22.75-98zm283.35-153.37a13.9 13.9 0 01-9.82-23.72L478.45 54.74l-20-20-33.1 33.17a13.89 13.89 0 11-19.65-19.65l43-43a13.89 13.89 0 0119.65 0l39.62 39.62a13.89 13.89 0 010 19.65L383.42 189.08a13.88 13.88 0 01-9.83 4.07z"></path><path class="lineal-fill" d="M449.29 173.35l-144.1 33.46 33.46-144.1 110.64 110.64z"></path><path class="lineal-stroke" d="M305.18 220.71a13.9 13.9 0 01-13.53-17l33.46-144.1a13.89 13.89 0 0123.36-6.68l110.64 110.59a13.9 13.9 0 01-6.68 23.36l-144.1 33.47a14 14 0 01-3.15.36zm41.34-130.47l-22.76 98 98-22.75z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/minimize.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M457.26 512a13.88 13.88 0 01-9.83-4.07L322.92 383.42a13.9 13.9 0 0119.65-19.66l114.69 114.69 20-20-33.13-33.13a13.89 13.89 0 1119.65-19.65l43 43a13.89 13.89 0 010 19.65l-39.62 39.62a13.86 13.86 0 01-9.9 4.06z"></path><path class="lineal-fill" d="M338.65 449.29l-33.46-144.1 144.1 33.46-110.64 110.64z"></path><path class="lineal-stroke" d="M338.65 463.18a13.51 13.51 0 01-3.82-.54 13.86 13.86 0 01-9.72-10.21l-33.46-144.1a13.9 13.9 0 0116.68-16.68l144.1 33.46a13.89 13.89 0 016.68 23.36L348.48 459.11a13.93 13.93 0 01-9.83 4.07zm-14.89-139.41l22.76 98 75.24-75.24zM179.25 152.3a13.8 13.8 0 01-9.82-4.07L54.74 33.55l-20 20 33.17 33.1a13.89 13.89 0 01-19.65 19.65l-43-43a13.89 13.89 0 010-19.65L44.92 4.07a13.89 13.89 0 0119.65 0l124.51 124.51a13.9 13.9 0 01-9.83 23.72z"></path><path class="lineal-fill" d="M173.35 62.71l33.46 144.1-144.1-33.46L173.35 62.71z"></path><path class="lineal-stroke" d="M206.81 220.71a14 14 0 01-3.14-.36l-144.1-33.46a13.9 13.9 0 01-6.68-23.37L163.52 52.89a13.89 13.89 0 0123.36 6.68l33.26 143.21A13.89 13.89 0 01207 220.71zM90.24 165.48l98 22.75-22.75-98zM53.51 510.77a13.86 13.86 0 01-9.82-4.07L4.07 467.08a13.89 13.89 0 010-19.65l124.51-124.51a13.89 13.89 0 0119.65 19.65L33.55 457.26l20 20 33.14-33.14a13.9 13.9 0 1119.65 19.66l-43 43a13.86 13.86 0 01-9.83 3.99z"></path><path class="lineal-fill" d="M62.71 338.65l144.1-33.46-33.46 144.1L62.71 338.65z"></path><path class="lineal-stroke" d="M173.35 463.18a13.93 13.93 0 01-9.83-4.07L52.89 348.47a13.89 13.89 0 016.68-23.36l144.1-33.46a13.9 13.9 0 0116.68 16.68l-33.46 144.1a13.87 13.87 0 01-13.54 10.75zM90.24 346.52l75.24 75.24 22.75-98zm283.35-153.37a13.9 13.9 0 01-9.82-23.72L478.45 54.74l-20-20-33.1 33.17a13.89 13.89 0 11-19.65-19.65l43-43a13.89 13.89 0 0119.65 0l39.62 39.62a13.89 13.89 0 010 19.65L383.42 189.08a13.88 13.88 0 01-9.83 4.07z"></path><path class="lineal-fill" d="M449.29 173.35l-144.1 33.46 33.46-144.1 110.64 110.64z"></path><path class="lineal-stroke" d="M305.18 220.71a13.9 13.9 0 01-13.53-17l33.46-144.1a13.89 13.89 0 0123.36-6.68l110.64 110.59a13.9 13.9 0 01-6.68 23.36l-144.1 33.47a14 14 0 01-3.15.36zm41.34-130.47l-22.76 98 98-22.75z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">minimize</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/minimize.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/minimize.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 284.94" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/money.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M314.73 101.82a84 84 0 11-84.05-84 84 84 0 0184.05 84.05z"></path><path class="lineal-stroke" d="M230.69 196.51a94.69 94.69 0 1194.69-94.69 94.8 94.8 0 01-94.69 94.69zm0-168.1a73.41 73.41 0 1073.41 73.41 73.49 73.49 0 00-73.41-73.41z"></path><path class="lineal-stroke" d="M330.4 284.94H30.19A30.21 30.21 0 010 254.76V111.5a30.22 30.22 0 0130.19-30.19h29.46a10.64 10.64 0 110 21.28H30.19a8.91 8.91 0 00-8.91 8.91v143.26a8.92 8.92 0 008.91 8.91H330.4a8.92 8.92 0 008.91-8.91v-18.13a10.64 10.64 0 1121.28 0v18.13a30.21 30.21 0 01-30.19 30.18z"></path><path class="lineal-stroke" d="M379.41 203.64H79.19A30.22 30.22 0 0149 173.45V30.19A30.22 30.22 0 0179.19 0h300.22a30.22 30.22 0 0130.19 30.19v22.38a10.64 10.64 0 01-21.28 0V30.19a8.92 8.92 0 00-8.91-8.91H79.19a8.92 8.92 0 00-8.9 8.91v143.26a8.92 8.92 0 008.9 8.91h300.22a8.91 8.91 0 008.91-8.91V110a10.64 10.64 0 0121.28 0v63.42a30.22 30.22 0 01-30.19 30.19z"></path><path class="lineal-fill" d="M99.8 193a84 84 0 00167.45 0z"></path><path class="lineal-stroke" d="M183.52 280.55a94.66 94.66 0 01-94.33-86.66 10.66 10.66 0 0110.61-11.53h167.45a10.64 10.64 0 0110.6 11.53 94.66 94.66 0 01-94.33 86.66zm-71.2-76.91c8 32 37.32 55.64 71.2 55.64s63.18-23.66 71.21-55.64zm114.02-61.39c-13.9-.34-24.34-7.81-24.34-14.25 0-3.22 2.87-8 6.44-8 4.36 0 7.81 7.47 17.92 8.62v-22.91c-10.45-3.91-22.29-8.39-22.29-23.09s10.8-20.92 22.29-22.41V57c0-1.49 1.73-2.87 3.91-2.87 1.95 0 3.91 1.38 3.91 2.87v3c7.46.23 19.64 2.41 19.64 9.08 0 2.64-1.84 7.92-6.09 7.92-3.21 0-5.86-3.67-13.55-4.25V93c10.22 3.79 21.71 9 21.71 24.58 0 14.14-8.85 22.3-21.71 24.36v3.56c0 1.5-2 2.88-3.91 2.88-2.18 0-3.91-1.38-3.91-2.88zm.92-51.82V73.08c-5.74.92-9.19 3.68-9.19 8 0 5.06 3.91 7.24 9.19 9.31zm6 18v20c5-1 8.61-4 8.61-9.42 0-5.63-3.67-8.39-8.61-10.57z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 284.94" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/money.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M314.73 101.82a84 84 0 11-84.05-84 84 84 0 0184.05 84.05z"></path><path class="lineal-stroke" d="M230.69 196.51a94.69 94.69 0 1194.69-94.69 94.8 94.8 0 01-94.69 94.69zm0-168.1a73.41 73.41 0 1073.41 73.41 73.49 73.49 0 00-73.41-73.41z"></path><path class="lineal-stroke" d="M330.4 284.94H30.19A30.21 30.21 0 010 254.76V111.5a30.22 30.22 0 0130.19-30.19h29.46a10.64 10.64 0 110 21.28H30.19a8.91 8.91 0 00-8.91 8.91v143.26a8.92 8.92 0 008.91 8.91H330.4a8.92 8.92 0 008.91-8.91v-18.13a10.64 10.64 0 1121.28 0v18.13a30.21 30.21 0 01-30.19 30.18z"></path><path class="lineal-stroke" d="M379.41 203.64H79.19A30.22 30.22 0 0149 173.45V30.19A30.22 30.22 0 0179.19 0h300.22a30.22 30.22 0 0130.19 30.19v22.38a10.64 10.64 0 01-21.28 0V30.19a8.92 8.92 0 00-8.91-8.91H79.19a8.92 8.92 0 00-8.9 8.91v143.26a8.92 8.92 0 008.9 8.91h300.22a8.91 8.91 0 008.91-8.91V110a10.64 10.64 0 0121.28 0v63.42a30.22 30.22 0 01-30.19 30.19z"></path><path class="lineal-fill" d="M99.8 193a84 84 0 00167.45 0z"></path><path class="lineal-stroke" d="M183.52 280.55a94.66 94.66 0 01-94.33-86.66 10.66 10.66 0 0110.61-11.53h167.45a10.64 10.64 0 0110.6 11.53 94.66 94.66 0 01-94.33 86.66zm-71.2-76.91c8 32 37.32 55.64 71.2 55.64s63.18-23.66 71.21-55.64zm114.02-61.39c-13.9-.34-24.34-7.81-24.34-14.25 0-3.22 2.87-8 6.44-8 4.36 0 7.81 7.47 17.92 8.62v-22.91c-10.45-3.91-22.29-8.39-22.29-23.09s10.8-20.92 22.29-22.41V57c0-1.49 1.73-2.87 3.91-2.87 1.95 0 3.91 1.38 3.91 2.87v3c7.46.23 19.64 2.41 19.64 9.08 0 2.64-1.84 7.92-6.09 7.92-3.21 0-5.86-3.67-13.55-4.25V93c10.22 3.79 21.71 9 21.71 24.58 0 14.14-8.85 22.3-21.71 24.36v3.56c0 1.5-2 2.88-3.91 2.88-2.18 0-3.91-1.38-3.91-2.88zm.92-51.82V73.08c-5.74.92-9.19 3.68-9.19 8 0 5.06 3.91 7.24 9.19 9.31zm6 18v20c5-1 8.61-4 8.61-9.42 0-5.63-3.67-8.39-8.61-10.57z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">money</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/money.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/money.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 401.13 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/music.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M93.28 450.16a14 14 0 01-14-14V107.49A14 14 0 0189 94.15L382.89.66A14 14 0 01401.13 14v356.66a14 14 0 11-28 0V33.13l-265.85 84.59v318.45a14 14 0 01-14 13.99z"></path><path class="lineal-fill" d="M93.28 107.49v111.62l293.85-93.49V13.99l-293.85 93.5z"></path><path class="lineal-stroke" d="M93.28 233.1a14 14 0 01-14-14V107.49A14 14 0 0189 94.15L382.89.66A14 14 0 01401.13 14v111.62a14 14 0 01-9.76 13.38L97.53 232.44a13.76 13.76 0 01-4.25.66zm14-115.38V200l265.86-84.59V33.13zm42.44 323.15a14 14 0 01-14-14V262.23a14 14 0 0128 0v164.65a14 14 0 01-14 13.99zm180.97-124.4a14 14 0 01-14-14V192.26a14 14 0 0128 0v110.22a14 14 0 01-14 13.99z"></path><circle class="lineal-fill" cx="81.86" cy="430.14" r="67.87"></circle><path class="lineal-stroke" d="M81.86 512a81.86 81.86 0 1181.86-81.86A81.95 81.95 0 0181.86 512zm0-135.73a53.87 53.87 0 1053.87 53.87 53.93 53.93 0 00-53.87-53.87zm237.41 75.56a81.86 81.86 0 110-163.71 83.43 83.43 0 0113.23 1.06 14 14 0 01-4.5 27.63A53.88 53.88 0 10373.14 370a14 14 0 1128 0 81.94 81.94 0 01-81.87 81.83z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 401.13 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/music.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M93.28 450.16a14 14 0 01-14-14V107.49A14 14 0 0189 94.15L382.89.66A14 14 0 01401.13 14v356.66a14 14 0 11-28 0V33.13l-265.85 84.59v318.45a14 14 0 01-14 13.99z"></path><path class="lineal-fill" d="M93.28 107.49v111.62l293.85-93.49V13.99l-293.85 93.5z"></path><path class="lineal-stroke" d="M93.28 233.1a14 14 0 01-14-14V107.49A14 14 0 0189 94.15L382.89.66A14 14 0 01401.13 14v111.62a14 14 0 01-9.76 13.38L97.53 232.44a13.76 13.76 0 01-4.25.66zm14-115.38V200l265.86-84.59V33.13zm42.44 323.15a14 14 0 01-14-14V262.23a14 14 0 0128 0v164.65a14 14 0 01-14 13.99zm180.97-124.4a14 14 0 01-14-14V192.26a14 14 0 0128 0v110.22a14 14 0 01-14 13.99z"></path><circle class="lineal-fill" cx="81.86" cy="430.14" r="67.87"></circle><path class="lineal-stroke" d="M81.86 512a81.86 81.86 0 1181.86-81.86A81.95 81.95 0 0181.86 512zm0-135.73a53.87 53.87 0 1053.87 53.87 53.93 53.93 0 00-53.87-53.87zm237.41 75.56a81.86 81.86 0 110-163.71 83.43 83.43 0 0113.23 1.06 14 14 0 01-4.5 27.63A53.88 53.88 0 10373.14 370a14 14 0 1128 0 81.94 81.94 0 01-81.87 81.83z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">music</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/music.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/music.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 509.47" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/networking.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M230.79 462.77a14.57 14.57 0 110-29.14 4.55 4.55 0 004.53-4.53v-124a4.54 4.54 0 00-4.53-4.53H33.68a4.53 4.53 0 00-4.53 4.53v124a4.53 4.53 0 004.53 4.53h147.06a14.57 14.57 0 010 29.14H33.68A33.71 33.71 0 010 429.1v-124a33.72 33.72 0 0133.68-33.68h197.1a33.72 33.72 0 0133.68 33.68v124a33.71 33.71 0 01-33.67 33.67z"></path><path class="lineal-fill" d="M82.61 448.2h99.26v46.69H82.61z"></path><path class="lineal-stroke" d="M181.86 509.47H82.61A14.58 14.58 0 0168 494.9v-46.7a14.57 14.57 0 0114.58-14.57h99.25a14.57 14.57 0 0114.57 14.57v46.7a14.57 14.57 0 01-14.54 14.57zm-84.68-29.15h70.1v-17.55h-70.1z"></path><path class="lineal-stroke" d="M210.67 509.47H53.79a14.58 14.58 0 010-29.15h156.88a14.58 14.58 0 010 29.15zm20.12-318.11a14.58 14.58 0 110-29.15 4.54 4.54 0 004.53-4.53v-124a4.54 4.54 0 00-4.53-4.53H33.68a4.53 4.53 0 00-4.53 4.53v124a4.53 4.53 0 004.53 4.53h147.06a14.58 14.58 0 010 29.15H33.68A33.72 33.72 0 010 157.68v-124A33.72 33.72 0 0133.68 0h197.1a33.72 33.72 0 0133.68 33.68v124a33.72 33.72 0 01-33.67 33.68z"></path><path class="lineal-fill" d="M82.61 176.79h99.26v46.69H82.61z"></path><path class="lineal-stroke" d="M181.86 238.06H82.61A14.58 14.58 0 0168 223.48v-46.69a14.58 14.58 0 0114.58-14.58h99.25a14.58 14.58 0 0114.57 14.58v46.69a14.58 14.58 0 01-14.54 14.58zm-84.68-29.15h70.1v-17.55h-70.1z"></path><path class="lineal-stroke" d="M210.67 238.06H53.79a14.58 14.58 0 010-29.15h156.88a14.58 14.58 0 010 29.15zm203.54 143.61h-92.54a14.58 14.58 0 010-29.15h78V110.25h-78a14.57 14.57 0 110-29.14h92.54a14.57 14.57 0 0114.58 14.57v271.41a14.58 14.58 0 01-14.58 14.58z"></path><path class="lineal-fill" d="M481.62 237.48a35.4 35.4 0 00-48.44-47.31 55.53 55.53 0 00-98 46.15 30.18 30.18 0 00-18.18 27.6A30.17 30.17 0 00347.06 294h120.29a30.17 30.17 0 0030.08-30.07 30.15 30.15 0 00-15.81-26.45z"></path><path class="lineal-stroke" d="M467.35 308.57H347.06a44.62 44.62 0 01-27.62-79.69c-.1-1.52-.15-3-.15-4.57A70.11 70.11 0 01437.16 173a50 50 0 0161.72 59.37 44.61 44.61 0 01-31.53 76.21zm-78-125.22a41 41 0 00-40 49.83 14.56 14.56 0 01-8.43 16.5 15.49 15.49 0 006.09 29.74h120.34a15.47 15.47 0 007.31-29.13 14.59 14.59 0 01-6-19.51 20.54 20.54 0 002.32-9.55 20.84 20.84 0 00-20.82-20.82 20.49 20.49 0 00-10 2.54 14.58 14.58 0 01-18.49-3.81 40.72 40.72 0 00-32.27-15.79z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 509.47" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/networking.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M230.79 462.77a14.57 14.57 0 110-29.14 4.55 4.55 0 004.53-4.53v-124a4.54 4.54 0 00-4.53-4.53H33.68a4.53 4.53 0 00-4.53 4.53v124a4.53 4.53 0 004.53 4.53h147.06a14.57 14.57 0 010 29.14H33.68A33.71 33.71 0 010 429.1v-124a33.72 33.72 0 0133.68-33.68h197.1a33.72 33.72 0 0133.68 33.68v124a33.71 33.71 0 01-33.67 33.67z"></path><path class="lineal-fill" d="M82.61 448.2h99.26v46.69H82.61z"></path><path class="lineal-stroke" d="M181.86 509.47H82.61A14.58 14.58 0 0168 494.9v-46.7a14.57 14.57 0 0114.58-14.57h99.25a14.57 14.57 0 0114.57 14.57v46.7a14.57 14.57 0 01-14.54 14.57zm-84.68-29.15h70.1v-17.55h-70.1z"></path><path class="lineal-stroke" d="M210.67 509.47H53.79a14.58 14.58 0 010-29.15h156.88a14.58 14.58 0 010 29.15zm20.12-318.11a14.58 14.58 0 110-29.15 4.54 4.54 0 004.53-4.53v-124a4.54 4.54 0 00-4.53-4.53H33.68a4.53 4.53 0 00-4.53 4.53v124a4.53 4.53 0 004.53 4.53h147.06a14.58 14.58 0 010 29.15H33.68A33.72 33.72 0 010 157.68v-124A33.72 33.72 0 0133.68 0h197.1a33.72 33.72 0 0133.68 33.68v124a33.72 33.72 0 01-33.67 33.68z"></path><path class="lineal-fill" d="M82.61 176.79h99.26v46.69H82.61z"></path><path class="lineal-stroke" d="M181.86 238.06H82.61A14.58 14.58 0 0168 223.48v-46.69a14.58 14.58 0 0114.58-14.58h99.25a14.58 14.58 0 0114.57 14.58v46.69a14.58 14.58 0 01-14.54 14.58zm-84.68-29.15h70.1v-17.55h-70.1z"></path><path class="lineal-stroke" d="M210.67 238.06H53.79a14.58 14.58 0 010-29.15h156.88a14.58 14.58 0 010 29.15zm203.54 143.61h-92.54a14.58 14.58 0 010-29.15h78V110.25h-78a14.57 14.57 0 110-29.14h92.54a14.57 14.57 0 0114.58 14.57v271.41a14.58 14.58 0 01-14.58 14.58z"></path><path class="lineal-fill" d="M481.62 237.48a35.4 35.4 0 00-48.44-47.31 55.53 55.53 0 00-98 46.15 30.18 30.18 0 00-18.18 27.6A30.17 30.17 0 00347.06 294h120.29a30.17 30.17 0 0030.08-30.07 30.15 30.15 0 00-15.81-26.45z"></path><path class="lineal-stroke" d="M467.35 308.57H347.06a44.62 44.62 0 01-27.62-79.69c-.1-1.52-.15-3-.15-4.57A70.11 70.11 0 01437.16 173a50 50 0 0161.72 59.37 44.61 44.61 0 01-31.53 76.21zm-78-125.22a41 41 0 00-40 49.83 14.56 14.56 0 01-8.43 16.5 15.49 15.49 0 006.09 29.74h120.34a15.47 15.47 0 007.31-29.13 14.59 14.59 0 01-6-19.51 20.54 20.54 0 002.32-9.55 20.84 20.84 0 00-20.82-20.82 20.49 20.49 0 00-10 2.54 14.58 14.58 0 01-18.49-3.81 40.72 40.72 0 00-32.27-15.79z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">networking</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/networking.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/networking.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/networking-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M256 420.13h-1.09A164.13 164.13 0 11420.13 256a167.91 167.91 0 01-1.13 19.25 164.62 164.62 0 01-46.1 95.94 15.19 15.19 0 01-21.64-21.32 134 134 0 0037.56-78.15 136 136 0 00.92-15.72 133.77 133.77 0 10-134.4 133.74h.6a15.19 15.19 0 01.05 30.38z"></path><path class="lineal-fill" d="M322.62 179.65c-29.5 17.19-29.79 62.18-45 80.21s-78.74-26.51-76.84-54-7-24-12.08-28.34c-3.23-2.73 14-37.7 12.34-58.44 17-6.76 35.58-12 55-12 30.4 0 58.69 10.65 82.26 26.29 1.35 18.54-.96 37.7-15.68 46.28z"></path><path class="lineal-stroke" d="M267 279.23c-21.36 0-47.58-17.67-62.9-34.08-9-9.69-19.58-24.56-18.49-40.35.45-6.55.13-10-.16-11.66a27.94 27.94 0 01-6.58-4c-9.12-7.69-5.87-17.7-1-32.85 3.46-10.67 8.7-26.81 8-36A15.19 15.19 0 01195.4 105c22.15-8.8 42-13.08 60.6-13.08 30.89 0 62.24 10 90.66 28.82a15.17 15.17 0 016.74 11.52c2.24 29.94-5.54 50.32-23.13 60.56-13.24 7.72-19.14 25.32-24.84 42.34-4.38 13.07-8.52 25.42-16.25 34.57-3.69 4.27-10.54 9.5-22.18 9.5zm-61.58-109.37c8.78 7 11.78 18.13 10.48 37-.15 2.06 1.84 8.36 10.39 17.52 13.4 14.36 32.12 24.38 40.61 24.44 3.59-5.09 6.7-14.39 9.72-23.4 6.79-20.22 15.23-45.42 38.38-58.9 6.68-3.88 8.45-14.41 8.44-24.58-21.65-12.94-44.81-19.69-67.44-19.69-12.42 0-25.37 2.4-40.18 7.51-1.42 12.36-5.69 25.54-9 35.86-.46 1.32-.94 2.8-1.4 4.24z"></path><path class="lineal-fill" d="M256 405.38c-45.09-.2-86.18-22.44-113.35-54.28C161 328.57 199.46 338 210.74 315c19.26-39.27 80.8 37.41 45.26 90.38z"></path><path class="lineal-stroke" d="M256 420.56h-.07c-47.18-.2-92.69-21.93-124.83-59.6a15.18 15.18 0 01-.23-19.44c12.09-14.87 29.58-19.24 43.64-22.75 12.34-3.08 20-5.23 22.59-10.44 6-12.26 16.37-19.29 28.39-19.29 16.31 0 33.55 13.34 45 34.83 12.52 23.47 18.6 59.43-1.89 90a15.19 15.19 0 01-12.6 6.69zm-90.43-67.46c22.85 21.22 52.1 34.42 81.75 36.73 8-17.82 3.75-37.84-3.62-51.67-7.19-13.47-15.31-18.3-17.88-18.71a9.47 9.47 0 00-1.45 2.27c-8.91 18.14-27.54 22.79-42.5 26.53a120.23 120.23 0 00-16.3 4.85z"></path><path class="lineal-fill" d="M402.39 273.48c-3.93 33.76-17.46 64.06-40.11 87-26-5.34-31.13-28.73-45.26-44.91-33.16-38 27.32-46.53 61-46.53a68 68 0 0124.37 4.44z"></path><path class="lineal-stroke" d="M362.28 375.72a15.06 15.06 0 01-3.06-.31c-24.65-5.07-35.45-22.29-44.12-36.13a107.59 107.59 0 00-9.52-13.67c-16.21-18.57-14.78-33.12-10.72-42.05C306.59 257.75 352 253.9 378 253.9a82.39 82.39 0 0129.48 5.29 15.18 15.18 0 0110 16.05c-4.4 37.77-19.75 70.95-44.39 95.95a15.16 15.16 0 01-10.81 4.53zM322.59 296c.07.62.67 3.67 5.87 9.64a132.26 132.26 0 0112.38 17.52c6 9.57 10.37 16.11 16.94 19.77 13.57-16.15 22.9-35.95 27.45-58.2a55.1 55.1 0 00-7.19-.44c-32.7-.01-52.98 7.43-55.45 11.71z"></path><path class="lineal-stroke" d="M256 512A256 256 0 0175 75a256 256 0 01362 0 15.19 15.19 0 01-21.48 21.48A225.62 225.62 0 0096.46 415.54 225.62 225.62 0 00481.62 256a15.19 15.19 0 1130.38 0 256 256 0 01-256 256z"></path><circle class="lineal-fill" cx="85.73" cy="85.73" r="37.77"></circle><path class="lineal-stroke" d="M85.72 138.69a53 53 0 1137.45-15.52 52.6 52.6 0 01-37.45 15.52zm0-75.56a22.59 22.59 0 1016 6.62 22.44 22.44 0 00-16-6.62z"></path><circle class="lineal-fill" cx="426.28" cy="426.28" r="37.77"></circle><path class="lineal-stroke" d="M426.28 479.24a53 53 0 1137.45-15.51 52.62 52.62 0 01-37.45 15.51zm0-75.55a22.59 22.59 0 1016 6.62 22.4 22.4 0 00-16-6.62z"></path><circle class="lineal-fill" cx="426.28" cy="85.73" r="37.77" transform="rotate(-76.72 426.27 85.733)"></circle><path class="lineal-stroke" d="M426.28 138.69a53 53 0 1137.45-15.52 52.58 52.58 0 01-37.45 15.52zm0-75.56a22.59 22.59 0 1016 6.62 22.4 22.4 0 00-16-6.62z"></path><circle class="lineal-fill" cx="85.73" cy="426.28" r="37.77"></circle><path class="lineal-stroke" d="M85.72 479.24a53 53 0 1137.45-15.51 52.63 52.63 0 01-37.45 15.51zm0-75.55a22.59 22.59 0 1016 6.62 22.44 22.44 0 00-16-6.62z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/networking-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M256 420.13h-1.09A164.13 164.13 0 11420.13 256a167.91 167.91 0 01-1.13 19.25 164.62 164.62 0 01-46.1 95.94 15.19 15.19 0 01-21.64-21.32 134 134 0 0037.56-78.15 136 136 0 00.92-15.72 133.77 133.77 0 10-134.4 133.74h.6a15.19 15.19 0 01.05 30.38z"></path><path class="lineal-fill" d="M322.62 179.65c-29.5 17.19-29.79 62.18-45 80.21s-78.74-26.51-76.84-54-7-24-12.08-28.34c-3.23-2.73 14-37.7 12.34-58.44 17-6.76 35.58-12 55-12 30.4 0 58.69 10.65 82.26 26.29 1.35 18.54-.96 37.7-15.68 46.28z"></path><path class="lineal-stroke" d="M267 279.23c-21.36 0-47.58-17.67-62.9-34.08-9-9.69-19.58-24.56-18.49-40.35.45-6.55.13-10-.16-11.66a27.94 27.94 0 01-6.58-4c-9.12-7.69-5.87-17.7-1-32.85 3.46-10.67 8.7-26.81 8-36A15.19 15.19 0 01195.4 105c22.15-8.8 42-13.08 60.6-13.08 30.89 0 62.24 10 90.66 28.82a15.17 15.17 0 016.74 11.52c2.24 29.94-5.54 50.32-23.13 60.56-13.24 7.72-19.14 25.32-24.84 42.34-4.38 13.07-8.52 25.42-16.25 34.57-3.69 4.27-10.54 9.5-22.18 9.5zm-61.58-109.37c8.78 7 11.78 18.13 10.48 37-.15 2.06 1.84 8.36 10.39 17.52 13.4 14.36 32.12 24.38 40.61 24.44 3.59-5.09 6.7-14.39 9.72-23.4 6.79-20.22 15.23-45.42 38.38-58.9 6.68-3.88 8.45-14.41 8.44-24.58-21.65-12.94-44.81-19.69-67.44-19.69-12.42 0-25.37 2.4-40.18 7.51-1.42 12.36-5.69 25.54-9 35.86-.46 1.32-.94 2.8-1.4 4.24z"></path><path class="lineal-fill" d="M256 405.38c-45.09-.2-86.18-22.44-113.35-54.28C161 328.57 199.46 338 210.74 315c19.26-39.27 80.8 37.41 45.26 90.38z"></path><path class="lineal-stroke" d="M256 420.56h-.07c-47.18-.2-92.69-21.93-124.83-59.6a15.18 15.18 0 01-.23-19.44c12.09-14.87 29.58-19.24 43.64-22.75 12.34-3.08 20-5.23 22.59-10.44 6-12.26 16.37-19.29 28.39-19.29 16.31 0 33.55 13.34 45 34.83 12.52 23.47 18.6 59.43-1.89 90a15.19 15.19 0 01-12.6 6.69zm-90.43-67.46c22.85 21.22 52.1 34.42 81.75 36.73 8-17.82 3.75-37.84-3.62-51.67-7.19-13.47-15.31-18.3-17.88-18.71a9.47 9.47 0 00-1.45 2.27c-8.91 18.14-27.54 22.79-42.5 26.53a120.23 120.23 0 00-16.3 4.85z"></path><path class="lineal-fill" d="M402.39 273.48c-3.93 33.76-17.46 64.06-40.11 87-26-5.34-31.13-28.73-45.26-44.91-33.16-38 27.32-46.53 61-46.53a68 68 0 0124.37 4.44z"></path><path class="lineal-stroke" d="M362.28 375.72a15.06 15.06 0 01-3.06-.31c-24.65-5.07-35.45-22.29-44.12-36.13a107.59 107.59 0 00-9.52-13.67c-16.21-18.57-14.78-33.12-10.72-42.05C306.59 257.75 352 253.9 378 253.9a82.39 82.39 0 0129.48 5.29 15.18 15.18 0 0110 16.05c-4.4 37.77-19.75 70.95-44.39 95.95a15.16 15.16 0 01-10.81 4.53zM322.59 296c.07.62.67 3.67 5.87 9.64a132.26 132.26 0 0112.38 17.52c6 9.57 10.37 16.11 16.94 19.77 13.57-16.15 22.9-35.95 27.45-58.2a55.1 55.1 0 00-7.19-.44c-32.7-.01-52.98 7.43-55.45 11.71z"></path><path class="lineal-stroke" d="M256 512A256 256 0 0175 75a256 256 0 01362 0 15.19 15.19 0 01-21.48 21.48A225.62 225.62 0 0096.46 415.54 225.62 225.62 0 00481.62 256a15.19 15.19 0 1130.38 0 256 256 0 01-256 256z"></path><circle class="lineal-fill" cx="85.73" cy="85.73" r="37.77"></circle><path class="lineal-stroke" d="M85.72 138.69a53 53 0 1137.45-15.52 52.6 52.6 0 01-37.45 15.52zm0-75.56a22.59 22.59 0 1016 6.62 22.44 22.44 0 00-16-6.62z"></path><circle class="lineal-fill" cx="426.28" cy="426.28" r="37.77"></circle><path class="lineal-stroke" d="M426.28 479.24a53 53 0 1137.45-15.51 52.62 52.62 0 01-37.45 15.51zm0-75.55a22.59 22.59 0 1016 6.62 22.4 22.4 0 00-16-6.62z"></path><circle class="lineal-fill" cx="426.28" cy="85.73" r="37.77" transform="rotate(-76.72 426.27 85.733)"></circle><path class="lineal-stroke" d="M426.28 138.69a53 53 0 1137.45-15.52 52.58 52.58 0 01-37.45 15.52zm0-75.56a22.59 22.59 0 1016 6.62 22.4 22.4 0 00-16-6.62z"></path><circle class="lineal-fill" cx="85.73" cy="426.28" r="37.77"></circle><path class="lineal-stroke" d="M85.72 479.24a53 53 0 1137.45-15.51 52.63 52.63 0 01-37.45 15.51zm0-75.55a22.59 22.59 0 1016 6.62 22.44 22.44 0 00-16-6.62z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">networking-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/networking-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/networking-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 331.57" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/open.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M344.93 11.38H39.07a27.69 27.69 0 00-27.69 27.69v76a36.13 36.13 0 0072.25 0 36.13 36.13 0 0072.25 0 36.12 36.12 0 0072.24 0 36.13 36.13 0 0072.26 0 36.12 36.12 0 0072.24 0v-76a27.69 27.69 0 00-27.69-27.69z"></path><path class="lineal-stroke" d="M344.93 0H39.07A39.12 39.12 0 000 39.07v76a47.52 47.52 0 0023.12 40.75v164.4a11.39 11.39 0 0011.38 11.35h315a11.38 11.38 0 0011.38-11.38V205.36a11.38 11.38 0 00-22.76 0v103.45H45.88V162.5h1.62a47.43 47.43 0 0036.13-16.69 47.43 47.43 0 0072.24 0 47.44 47.44 0 0072.25 0 47.44 47.44 0 0072.25 0A47.48 47.48 0 00384 115V39a39.12 39.12 0 00-39.07-39zm16.31 115a24.75 24.75 0 01-49.49 0V82A11.38 11.38 0 00289 82v33a24.75 24.75 0 01-49.49 0V60.29a11.38 11.38 0 10-22.75 0V115a24.75 24.75 0 01-49.5 0V82a11.38 11.38 0 10-22.75 0v33A24.75 24.75 0 0195 115V60.29a11.38 11.38 0 00-22.76 0V115a24.75 24.75 0 01-49.49 0V39a16.33 16.33 0 0116.32-16.24h305.86a16.33 16.33 0 0116.31 16.31z"></path><path class="lineal-stroke" d="M138.59 249.39h-23.23c.3-2.64 4.49-5.51 9.32-8.82 8.65-5.92 19.42-13.29 19.42-26.14 0-13.26-11.76-20.41-22.83-20.41-10.74 0-22.17 6.66-22.17 19 0 5.76 2.58 8.67 7.66 8.67 5.69 0 8.77-3.31 8.77-6.44 0-4.83 3.17-5.84 5.84-5.84 4.38 0 5.93 3 5.93 5.47 0 5-6.33 9.67-13 14.58-8 5.88-16.28 12-16.28 20.23v9c0 3.48 4.35 5.61 7.46 5.61h33.14c2.93 0 5.51-3.53 5.51-7.56s-2.53-7.38-5.51-7.38z"></path><path class="lineal-stroke" d="M188.18 234.32h-2.86v-5.38c0-3.35-3.29-5.51-8.4-5.51s-8.39 2.16-8.39 5.51v5.38h-5l15.68-31.45a5.68 5.68 0 00.55-2.22c0-4.29-5.54-6.63-8.39-6.63a7.64 7.64 0 00-7.06 4.34l-21.52 42.14a7 7 0 00-.88 3.33c0 3.69 2.4 6.17 6 6.17h20.64v8.72c0 3.85 4.35 5.61 8.39 5.61s8.4-1.76 8.4-5.61V250h2.86c2.89 0 5.61-3.82 5.61-7.84 0-3.78-1.76-7.84-5.61-7.84zM231 190.21a5.21 5.21 0 00-4.93 3l-32.67 67.05a5.17 5.17 0 00-.58 2.28 6.29 6.29 0 006.34 6.07 5.78 5.78 0 005.21-3l32.76-67.09a5.23 5.23 0 00.49-2.27c0-3.64-3.42-6.07-6.63-6.07zm47.55 3.79h-33c-3.84 0-7.47 2.73-7.47 5.61v14.43c0 3.13 3.65 5.6 8.31 5.6s8.49-2.52 8.49-5.6V209h14.38v5l-22.75 39.4a5.92 5.92 0 00-.8 3c0 5 5.46 8.49 10.35 8.49 2.48 0 4.2-.86 5.11-2.57l21.77-41.68c.94-1.76 3.11-6.18 3.11-9.38v-11.63c0-3-4.17-5.61-7.46-5.61z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 331.57" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/open.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M344.93 11.38H39.07a27.69 27.69 0 00-27.69 27.69v76a36.13 36.13 0 0072.25 0 36.13 36.13 0 0072.25 0 36.12 36.12 0 0072.24 0 36.13 36.13 0 0072.26 0 36.12 36.12 0 0072.24 0v-76a27.69 27.69 0 00-27.69-27.69z"></path><path class="lineal-stroke" d="M344.93 0H39.07A39.12 39.12 0 000 39.07v76a47.52 47.52 0 0023.12 40.75v164.4a11.39 11.39 0 0011.38 11.35h315a11.38 11.38 0 0011.38-11.38V205.36a11.38 11.38 0 00-22.76 0v103.45H45.88V162.5h1.62a47.43 47.43 0 0036.13-16.69 47.43 47.43 0 0072.24 0 47.44 47.44 0 0072.25 0 47.44 47.44 0 0072.25 0A47.48 47.48 0 00384 115V39a39.12 39.12 0 00-39.07-39zm16.31 115a24.75 24.75 0 01-49.49 0V82A11.38 11.38 0 00289 82v33a24.75 24.75 0 01-49.49 0V60.29a11.38 11.38 0 10-22.75 0V115a24.75 24.75 0 01-49.5 0V82a11.38 11.38 0 10-22.75 0v33A24.75 24.75 0 0195 115V60.29a11.38 11.38 0 00-22.76 0V115a24.75 24.75 0 01-49.49 0V39a16.33 16.33 0 0116.32-16.24h305.86a16.33 16.33 0 0116.31 16.31z"></path><path class="lineal-stroke" d="M138.59 249.39h-23.23c.3-2.64 4.49-5.51 9.32-8.82 8.65-5.92 19.42-13.29 19.42-26.14 0-13.26-11.76-20.41-22.83-20.41-10.74 0-22.17 6.66-22.17 19 0 5.76 2.58 8.67 7.66 8.67 5.69 0 8.77-3.31 8.77-6.44 0-4.83 3.17-5.84 5.84-5.84 4.38 0 5.93 3 5.93 5.47 0 5-6.33 9.67-13 14.58-8 5.88-16.28 12-16.28 20.23v9c0 3.48 4.35 5.61 7.46 5.61h33.14c2.93 0 5.51-3.53 5.51-7.56s-2.53-7.38-5.51-7.38z"></path><path class="lineal-stroke" d="M188.18 234.32h-2.86v-5.38c0-3.35-3.29-5.51-8.4-5.51s-8.39 2.16-8.39 5.51v5.38h-5l15.68-31.45a5.68 5.68 0 00.55-2.22c0-4.29-5.54-6.63-8.39-6.63a7.64 7.64 0 00-7.06 4.34l-21.52 42.14a7 7 0 00-.88 3.33c0 3.69 2.4 6.17 6 6.17h20.64v8.72c0 3.85 4.35 5.61 8.39 5.61s8.4-1.76 8.4-5.61V250h2.86c2.89 0 5.61-3.82 5.61-7.84 0-3.78-1.76-7.84-5.61-7.84zM231 190.21a5.21 5.21 0 00-4.93 3l-32.67 67.05a5.17 5.17 0 00-.58 2.28 6.29 6.29 0 006.34 6.07 5.78 5.78 0 005.21-3l32.76-67.09a5.23 5.23 0 00.49-2.27c0-3.64-3.42-6.07-6.63-6.07zm47.55 3.79h-33c-3.84 0-7.47 2.73-7.47 5.61v14.43c0 3.13 3.65 5.6 8.31 5.6s8.49-2.52 8.49-5.6V209h14.38v5l-22.75 39.4a5.92 5.92 0 00-.8 3c0 5 5.46 8.49 10.35 8.49 2.48 0 4.2-.86 5.11-2.57l21.77-41.68c.94-1.76 3.11-6.18 3.11-9.38v-11.63c0-3-4.17-5.61-7.46-5.61z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">open</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/open.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/open.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 324.02 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/padlock.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M14.31 241.68v197.49a58.52 58.52 0 0058.52 58.52h178.36a58.52 58.52 0 0058.52-58.52V241.68zM162 407.85a47.7 47.7 0 1147.7-47.7 47.7 47.7 0 01-47.7 47.7z"></path><path class="lineal-stroke" d="M251.19 512H72.83A72.91 72.91 0 010 439.17V241.68a14.31 14.31 0 0114.31-14.3h295.4a14.31 14.31 0 0114.29 14.3v197.49A72.91 72.91 0 01251.19 512zM28.62 256v183.17a44.26 44.26 0 0044.21 44.21h178.36a44.26 44.26 0 0044.21-44.21V256zM162 422.16a62 62 0 1162-62 62.08 62.08 0 01-62 62zm0-95.4a33.39 33.39 0 1033.39 33.39A33.44 33.44 0 00162 326.76z"></path><path class="lineal-stroke" d="M68.56 234.54H20.38a14.31 14.31 0 010-28.62h48.18a14.31 14.31 0 010 28.62zm235.08 0h-48.18a14.31 14.31 0 010-28.62h48.18a14.31 14.31 0 010 28.62z"></path><path class="lineal-stroke" d="M45.14 256a14.3 14.3 0 01-14.31-14.31V124a124.16 124.16 0 01124-124h14.32a124.17 124.17 0 01124 124v101.16a14.31 14.31 0 11-28.62 0V124a95.51 95.51 0 00-95.4-95.4h-14.28A95.51 95.51 0 0059.44 124v117.68A14.3 14.3 0 0145.14 256z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 324.02 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/padlock.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M14.31 241.68v197.49a58.52 58.52 0 0058.52 58.52h178.36a58.52 58.52 0 0058.52-58.52V241.68zM162 407.85a47.7 47.7 0 1147.7-47.7 47.7 47.7 0 01-47.7 47.7z"></path><path class="lineal-stroke" d="M251.19 512H72.83A72.91 72.91 0 010 439.17V241.68a14.31 14.31 0 0114.31-14.3h295.4a14.31 14.31 0 0114.29 14.3v197.49A72.91 72.91 0 01251.19 512zM28.62 256v183.17a44.26 44.26 0 0044.21 44.21h178.36a44.26 44.26 0 0044.21-44.21V256zM162 422.16a62 62 0 1162-62 62.08 62.08 0 01-62 62zm0-95.4a33.39 33.39 0 1033.39 33.39A33.44 33.44 0 00162 326.76z"></path><path class="lineal-stroke" d="M68.56 234.54H20.38a14.31 14.31 0 010-28.62h48.18a14.31 14.31 0 010 28.62zm235.08 0h-48.18a14.31 14.31 0 010-28.62h48.18a14.31 14.31 0 010 28.62z"></path><path class="lineal-stroke" d="M45.14 256a14.3 14.3 0 01-14.31-14.31V124a124.16 124.16 0 01124-124h14.32a124.17 124.17 0 01124 124v101.16a14.31 14.31 0 11-28.62 0V124a95.51 95.51 0 00-95.4-95.4h-14.28A95.51 95.51 0 0059.44 124v117.68A14.3 14.3 0 0145.14 256z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">padlock</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/padlock.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/padlock.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 337.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/paint-roller.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M239.8 157h-185c-23.8 0-43.1-19.3-43.1-43.1V54.8C11.7 31 31 11.7 54.8 11.7h185c23.8 0 43.1 19.3 43.2 43.1v59.1c-.1 23.8-19.4 43.1-43.2 43.1z"></path><path class="lineal-stroke" d="M239.8 168.6h-185C24.5 168.6 0 144.1 0 113.8v-59C0 24.5 24.5 0 54.8 0h185c30.2 0 54.7 24.5 54.8 54.8v59.1c-.1 30.2-24.6 54.7-54.8 54.7zM54.8 23.2c-17.4 0-31.5 14.1-31.5 31.5v59.1c0 17.4 14.1 31.5 31.5 31.5h185c17.4 0 31.5-14.1 31.5-31.5v-59c0-17.4-14.1-31.5-31.5-31.5l-185-.1z"></path><path class="lineal-stroke" d="M147.3 302.7c-6.4 0-11.6-5.2-11.6-11.6v-47.5c0-21.7 17.6-39.2 39.3-39.3h123.6c8.8 0 16-7.2 16-16V112c0-8.8-7.2-16-16-16h-14.2c-6.4 0-11.6-5.2-11.6-11.6 0-6.4 5.2-11.6 11.6-11.6h14.2c21.7 0 39.2 17.6 39.3 39.2v76.4c0 21.7-17.6 39.2-39.3 39.2H174.9c-8.8 0-16 7.2-16 16v47.5c0 6.4-5.2 11.6-11.6 11.6z"></path><path class="lineal-stroke" d="M160.6 409.6h-26.7c-16.3 0-29.6-13.3-29.6-29.6v-17.6c0-6.4 5.2-11.6 11.6-11.6 6.4 0 11.6 5.2 11.6 11.6V380c0 3.5 2.9 6.4 6.4 6.4h26.7c3.5 0 6.4-2.9 6.4-6.4v-68.6c0-3.5-2.9-6.4-6.4-6.4h-26.7c-3.5 0-6.4 2.9-6.4 6.4v2.9c0 6.4-5.2 11.6-11.6 11.6-6.4 0-11.6-5.2-11.6-11.6v-2.9c0-16.4 13.3-29.6 29.6-29.6h26.7c16.3 0 29.6 13.3 29.6 29.6V380c0 16.3-13.2 29.6-29.6 29.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 337.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/paint-roller.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M239.8 157h-185c-23.8 0-43.1-19.3-43.1-43.1V54.8C11.7 31 31 11.7 54.8 11.7h185c23.8 0 43.1 19.3 43.2 43.1v59.1c-.1 23.8-19.4 43.1-43.2 43.1z"></path><path class="lineal-stroke" d="M239.8 168.6h-185C24.5 168.6 0 144.1 0 113.8v-59C0 24.5 24.5 0 54.8 0h185c30.2 0 54.7 24.5 54.8 54.8v59.1c-.1 30.2-24.6 54.7-54.8 54.7zM54.8 23.2c-17.4 0-31.5 14.1-31.5 31.5v59.1c0 17.4 14.1 31.5 31.5 31.5h185c17.4 0 31.5-14.1 31.5-31.5v-59c0-17.4-14.1-31.5-31.5-31.5l-185-.1z"></path><path class="lineal-stroke" d="M147.3 302.7c-6.4 0-11.6-5.2-11.6-11.6v-47.5c0-21.7 17.6-39.2 39.3-39.3h123.6c8.8 0 16-7.2 16-16V112c0-8.8-7.2-16-16-16h-14.2c-6.4 0-11.6-5.2-11.6-11.6 0-6.4 5.2-11.6 11.6-11.6h14.2c21.7 0 39.2 17.6 39.3 39.2v76.4c0 21.7-17.6 39.2-39.3 39.2H174.9c-8.8 0-16 7.2-16 16v47.5c0 6.4-5.2 11.6-11.6 11.6z"></path><path class="lineal-stroke" d="M160.6 409.6h-26.7c-16.3 0-29.6-13.3-29.6-29.6v-17.6c0-6.4 5.2-11.6 11.6-11.6 6.4 0 11.6 5.2 11.6 11.6V380c0 3.5 2.9 6.4 6.4 6.4h26.7c3.5 0 6.4-2.9 6.4-6.4v-68.6c0-3.5-2.9-6.4-6.4-6.4h-26.7c-3.5 0-6.4 2.9-6.4 6.4v2.9c0 6.4-5.2 11.6-11.6 11.6-6.4 0-11.6-5.2-11.6-11.6v-2.9c0-16.4 13.3-29.6 29.6-29.6h26.7c16.3 0 29.6 13.3 29.6 29.6V380c0 16.3-13.2 29.6-29.6 29.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">paint-roller</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/paint-roller.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/paint-roller.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/paper-plane.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M289 512c-5.3 0-10.3-2.8-13-7.4l-54.4-91.2c-4.3-7.2-1.9-16.5 5.3-20.7s16.5-1.9 20.7 5.3l39.3 65.9 181-419.8L48.2 225.2l146.1 87.2c7.2 4.3 9.5 13.6 5.3 20.7-4.3 7.2-13.6 9.5-20.7 5.3L7.4 236c-7.2-4.3-9.5-13.5-5.2-20.7 1.6-2.7 4.1-4.9 7-6.1l481.7-208c7.7-3.3 16.6.2 19.9 7.9 1.6 3.8 1.6 8.2 0 12L302.9 502.9c-2.2 5.2-7.2 8.7-12.9 9.1h-1z"></path><path class="lineal-fill" d="M496.9 15.1L15.1 223l171.5 102.4z"></path><path class="lineal-stroke" d="M186.6 340.5c-2.7 0-5.4-.7-7.7-2.1L7.4 236c-7.2-4.3-9.5-13.5-5.2-20.7 1.6-2.7 4.1-4.9 7-6.1l481.7-208c7.7-3.3 16.6.2 19.9 7.9 2.5 5.7 1.2 12.3-3.2 16.7L197.3 336.1c-2.8 2.8-6.7 4.4-10.7 4.4zM48.2 225.2l136 81.2L430.4 60.3 48.2 225.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/paper-plane.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M289 512c-5.3 0-10.3-2.8-13-7.4l-54.4-91.2c-4.3-7.2-1.9-16.5 5.3-20.7s16.5-1.9 20.7 5.3l39.3 65.9 181-419.8L48.2 225.2l146.1 87.2c7.2 4.3 9.5 13.6 5.3 20.7-4.3 7.2-13.6 9.5-20.7 5.3L7.4 236c-7.2-4.3-9.5-13.5-5.2-20.7 1.6-2.7 4.1-4.9 7-6.1l481.7-208c7.7-3.3 16.6.2 19.9 7.9 1.6 3.8 1.6 8.2 0 12L302.9 502.9c-2.2 5.2-7.2 8.7-12.9 9.1h-1z"></path><path class="lineal-fill" d="M496.9 15.1L15.1 223l171.5 102.4z"></path><path class="lineal-stroke" d="M186.6 340.5c-2.7 0-5.4-.7-7.7-2.1L7.4 236c-7.2-4.3-9.5-13.5-5.2-20.7 1.6-2.7 4.1-4.9 7-6.1l481.7-208c7.7-3.3 16.6.2 19.9 7.9 2.5 5.7 1.2 12.3-3.2 16.7L197.3 336.1c-2.8 2.8-6.7 4.4-10.7 4.4zM48.2 225.2l136 81.2L430.4 60.3 48.2 225.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">paper-plane</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/paper-plane.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/paper-plane.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 404.41 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/paper.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M253.06 409.6h-221A32.1 32.1 0 010 377.53V32.07A32.11 32.11 0 0132.07 0h267.66a32.11 32.11 0 0132.07 32.07v61.65h-24.1V32.07a8 8 0 00-8-8H32.07a8 8 0 00-8 8v345.46a8 8 0 008 8h211l64.62-64.61V190.07h24.1v140.8z"></path><path class="lineal-stroke" d="M67.06 96.38h104.86v24.1H67.06zm0 96.37h104.86v24.09H67.06zm0 96.38h104.86v24.09H67.06z"></path><path class="lineal-fill" d="M179.38 238.5l-22.78 55.07c-3.37 8.18 3.69 15.24 11.86 11.86l55.07-22.77c3.08-1.28 4.25-5.17 2.18-7.24l-39.1-39.1c-2.07-2.07-6-.9-7.23 2.18z"></path><path class="lineal-stroke" d="M164.31 318.34a20.57 20.57 0 01-17.15-9 21.64 21.64 0 01-1.69-20.34l22.77-55.07a17.29 17.29 0 0115.76-10.7 15.62 15.62 0 0111.13 4.58l39.1 39.09a15.85 15.85 0 014.25 14.35 17.2 17.2 0 01-10.35 12.54l-55.07 22.77a22.81 22.81 0 01-8.75 1.78zm22.06-65.22l-15.89 38.44 38.44-15.9z"></path><path class="lineal-fill" d="M226.91 279.65L361.53 145l-22.26-22.26L317 100.5 182.39 235.13c-.12.11 44.4 44.64 44.52 44.52z"></path><path class="lineal-stroke" d="M231.85 291.74h-5c-4.91-.05-7.41-2.51-10.31-5.36-1.24-1.21-3-2.95-5.1-5-4.19-4.14-9.74-9.68-15.29-15.23-23.83-23.83-23.83-23.83-24.87-26.37l-3-7.42L317 83.46 378.57 145zm-32.5-56.54c7.83 7.87 19.61 19.65 27.49 27.48L344.49 145 317 117.54z"></path><path class="lineal-fill" d="M361.56 145l26.73-26.73a13.91 13.91 0 000-19.68l-24.83-24.85a13.92 13.92 0 00-19.69 0L317 100.47S361.52 145 361.56 145z"></path><path class="lineal-stroke" d="M366.26 157.33l-5.4-.31c-4.57-.27-6.84-2.53-9.72-5.39l-5.07-5-15.3-15.28c-5.56-5.56-11.12-11.12-15.29-15.31-8.77-8.78-8.77-8.78-9.7-11.24L303 97.47l32.24-32.25a26 26 0 0136.72 0l24.84 24.84a26 26 0 010 36.72zm-32.21-56.83c7.87 7.88 19.6 19.61 27.48 27.48l18.24-18.24a1.81 1.81 0 00.55-1.32 1.84 1.84 0 00-.55-1.33l-24.83-24.83a1.88 1.88 0 00-1.33-.55 1.81 1.81 0 00-1.32.55z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 404.41 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/paper.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M253.06 409.6h-221A32.1 32.1 0 010 377.53V32.07A32.11 32.11 0 0132.07 0h267.66a32.11 32.11 0 0132.07 32.07v61.65h-24.1V32.07a8 8 0 00-8-8H32.07a8 8 0 00-8 8v345.46a8 8 0 008 8h211l64.62-64.61V190.07h24.1v140.8z"></path><path class="lineal-stroke" d="M67.06 96.38h104.86v24.1H67.06zm0 96.37h104.86v24.09H67.06zm0 96.38h104.86v24.09H67.06z"></path><path class="lineal-fill" d="M179.38 238.5l-22.78 55.07c-3.37 8.18 3.69 15.24 11.86 11.86l55.07-22.77c3.08-1.28 4.25-5.17 2.18-7.24l-39.1-39.1c-2.07-2.07-6-.9-7.23 2.18z"></path><path class="lineal-stroke" d="M164.31 318.34a20.57 20.57 0 01-17.15-9 21.64 21.64 0 01-1.69-20.34l22.77-55.07a17.29 17.29 0 0115.76-10.7 15.62 15.62 0 0111.13 4.58l39.1 39.09a15.85 15.85 0 014.25 14.35 17.2 17.2 0 01-10.35 12.54l-55.07 22.77a22.81 22.81 0 01-8.75 1.78zm22.06-65.22l-15.89 38.44 38.44-15.9z"></path><path class="lineal-fill" d="M226.91 279.65L361.53 145l-22.26-22.26L317 100.5 182.39 235.13c-.12.11 44.4 44.64 44.52 44.52z"></path><path class="lineal-stroke" d="M231.85 291.74h-5c-4.91-.05-7.41-2.51-10.31-5.36-1.24-1.21-3-2.95-5.1-5-4.19-4.14-9.74-9.68-15.29-15.23-23.83-23.83-23.83-23.83-24.87-26.37l-3-7.42L317 83.46 378.57 145zm-32.5-56.54c7.83 7.87 19.61 19.65 27.49 27.48L344.49 145 317 117.54z"></path><path class="lineal-fill" d="M361.56 145l26.73-26.73a13.91 13.91 0 000-19.68l-24.83-24.85a13.92 13.92 0 00-19.69 0L317 100.47S361.52 145 361.56 145z"></path><path class="lineal-stroke" d="M366.26 157.33l-5.4-.31c-4.57-.27-6.84-2.53-9.72-5.39l-5.07-5-15.3-15.28c-5.56-5.56-11.12-11.12-15.29-15.31-8.77-8.78-8.77-8.78-9.7-11.24L303 97.47l32.24-32.25a26 26 0 0136.72 0l24.84 24.84a26 26 0 010 36.72zm-32.21-56.83c7.87 7.88 19.6 19.61 27.48 27.48l18.24-18.24a1.81 1.81 0 00.55-1.32 1.84 1.84 0 00-.55-1.33l-24.83-24.83a1.88 1.88 0 00-1.33-.55 1.81 1.81 0 00-1.32.55z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">paper</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/paper.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/paper.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 327.29" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/password.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M191.35 327.29H39.94A40 40 0 010 287.35V131.09a40 40 0 0139.94-39.94h151.41a40 40 0 0139.94 39.94V243a13.8 13.8 0 01-27.59 0V131.09a12.36 12.36 0 00-12.35-12.35H39.94a12.36 12.36 0 00-12.35 12.35v156.26a12.36 12.36 0 0012.35 12.35h151.41a13.8 13.8 0 010 27.59z"></path><path class="lineal-fill" d="M216.95 125.37H498.2v133.06H216.95z"></path><path class="lineal-stroke" d="M498.2 272.22H217a13.8 13.8 0 01-13.8-13.8V125.36a13.79 13.79 0 0113.8-13.79h281.2a13.79 13.79 0 0113.8 13.79v133.06a13.8 13.8 0 01-13.8 13.8zm-267.45-27.59h253.66V139.16H230.75zM187.49 111a13.79 13.79 0 01-13.79-13.8V85.64a58.06 58.06 0 00-116.11 0v11.53a13.8 13.8 0 11-27.59 0V85.64a85.65 85.65 0 01171.29 0v11.53a13.8 13.8 0 01-13.8 13.83z"></path><path class="lineal-stroke" d="M289.49 205.69H270a13.8 13.8 0 110-27.59h19.45a13.8 13.8 0 110 27.59zm77.82 0h-19.46a13.8 13.8 0 010-27.59h19.46a13.8 13.8 0 010 27.59zm77.81 0h-19.45a13.8 13.8 0 010-27.59h19.45a13.8 13.8 0 110 27.59z"></path><circle class="lineal-fill" cx="115.65" cy="207.07" r="33.11"></circle><path class="lineal-stroke" d="M115.64 254a46.91 46.91 0 1146.91-46.91A47 47 0 01115.64 254zm0-66.22A19.31 19.31 0 10135 207.07a19.33 19.33 0 00-19.36-19.31z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 327.29" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/password.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M191.35 327.29H39.94A40 40 0 010 287.35V131.09a40 40 0 0139.94-39.94h151.41a40 40 0 0139.94 39.94V243a13.8 13.8 0 01-27.59 0V131.09a12.36 12.36 0 00-12.35-12.35H39.94a12.36 12.36 0 00-12.35 12.35v156.26a12.36 12.36 0 0012.35 12.35h151.41a13.8 13.8 0 010 27.59z"></path><path class="lineal-fill" d="M216.95 125.37H498.2v133.06H216.95z"></path><path class="lineal-stroke" d="M498.2 272.22H217a13.8 13.8 0 01-13.8-13.8V125.36a13.79 13.79 0 0113.8-13.79h281.2a13.79 13.79 0 0113.8 13.79v133.06a13.8 13.8 0 01-13.8 13.8zm-267.45-27.59h253.66V139.16H230.75zM187.49 111a13.79 13.79 0 01-13.79-13.8V85.64a58.06 58.06 0 00-116.11 0v11.53a13.8 13.8 0 11-27.59 0V85.64a85.65 85.65 0 01171.29 0v11.53a13.8 13.8 0 01-13.8 13.83z"></path><path class="lineal-stroke" d="M289.49 205.69H270a13.8 13.8 0 110-27.59h19.45a13.8 13.8 0 110 27.59zm77.82 0h-19.46a13.8 13.8 0 010-27.59h19.46a13.8 13.8 0 010 27.59zm77.81 0h-19.45a13.8 13.8 0 010-27.59h19.45a13.8 13.8 0 110 27.59z"></path><circle class="lineal-fill" cx="115.65" cy="207.07" r="33.11"></circle><path class="lineal-stroke" d="M115.64 254a46.91 46.91 0 1146.91-46.91A47 47 0 01115.64 254zm0-66.22A19.31 19.31 0 10135 207.07a19.33 19.33 0 00-19.36-19.31z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">password</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/password.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/password.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 391.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/photo-camera.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M100.3 69.1V34.9c0-12.9 10.4-23.3 23.3-23.3H286c12.9 0 23.3 10.4 23.3 23.3v34.2"></path><path class="lineal-stroke" d="M309.2 80.8c-6.4 0-11.6-5.2-11.6-11.6V34.9c0-6.4-5.2-11.6-11.6-11.6H123.7c-6.4 0-11.6 5.2-11.7 11.6v34.2c.2 6.4-4.9 11.8-11.3 12s-11.8-4.9-12-11.3V34.9c0-19.2 15.7-34.9 35-34.9H286c19.3 0 34.9 15.7 34.9 34.9v34.2c0 6.4-5.2 11.7-11.7 11.7.1 0 .1 0 0 0z"></path><path class="lineal-stroke" d="M351.4 391.6H58.2c-32.1 0-58.2-26-58.2-58.1v-217c0-32.1 26-58.2 58.2-58.2h293.3c32.1 0 58.1 26.1 58.2 58.2v217c-.1 32.1-26.2 58.1-58.3 58.1zM58.2 81.5c-19.2 0-34.8 15.6-34.9 34.9v217c0 19.2 15.6 34.8 34.9 34.9h293.3c19.2 0 34.8-15.6 34.9-34.9v-217c0-19.2-15.6-34.8-34.9-34.9H58.2z"></path><path class="lineal-fill" d="M304.6 231.8c0 55.1-44.7 99.8-99.8 99.8S105 286.9 105 231.8c0-55.1 44.7-99.8 99.8-99.8 55.1 0 99.8 44.7 99.8 99.8z"></path><path class="lineal-stroke" d="M204.8 343.2c-61.5 0-111.4-49.9-111.4-111.4 0-61.5 49.9-111.4 111.4-111.4 61.5 0 111.4 49.9 111.4 111.4 0 61.5-49.9 111.4-111.4 111.4zm0-199.5c-48.7 0-88.1 39.5-88.1 88.1s39.5 88.1 88.1 88.1 88.1-39.5 88.1-88.1c0-48.7-39.4-88.1-88.1-88.1z"></path><path class="lineal-stroke" d="M204.8 286.5c-30.2 0-54.8-24.5-54.8-54.8s24.5-54.8 54.8-54.8c6.4 0 11.7 5.2 11.7 11.6 0 6.4-5.2 11.7-11.7 11.7-17.4 0-31.5 14.1-31.5 31.4s14.1 31.5 31.4 31.5 31.5-14.1 31.5-31.4c0-6.4 5.2-11.6 11.7-11.6 6.4 0 11.6 5.2 11.6 11.6 0 30.3-24.5 54.8-54.7 54.8zm139.8-158.4H298c-6.4.2-11.8-4.9-12-11.3-.2-6.4 4.9-11.8 11.3-12h47.3c6.4-.2 11.8 4.9 12 11.3.2 6.4-4.9 11.8-11.3 12h-.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 391.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/photo-camera.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M100.3 69.1V34.9c0-12.9 10.4-23.3 23.3-23.3H286c12.9 0 23.3 10.4 23.3 23.3v34.2"></path><path class="lineal-stroke" d="M309.2 80.8c-6.4 0-11.6-5.2-11.6-11.6V34.9c0-6.4-5.2-11.6-11.6-11.6H123.7c-6.4 0-11.6 5.2-11.7 11.6v34.2c.2 6.4-4.9 11.8-11.3 12s-11.8-4.9-12-11.3V34.9c0-19.2 15.7-34.9 35-34.9H286c19.3 0 34.9 15.7 34.9 34.9v34.2c0 6.4-5.2 11.7-11.7 11.7.1 0 .1 0 0 0z"></path><path class="lineal-stroke" d="M351.4 391.6H58.2c-32.1 0-58.2-26-58.2-58.1v-217c0-32.1 26-58.2 58.2-58.2h293.3c32.1 0 58.1 26.1 58.2 58.2v217c-.1 32.1-26.2 58.1-58.3 58.1zM58.2 81.5c-19.2 0-34.8 15.6-34.9 34.9v217c0 19.2 15.6 34.8 34.9 34.9h293.3c19.2 0 34.8-15.6 34.9-34.9v-217c0-19.2-15.6-34.8-34.9-34.9H58.2z"></path><path class="lineal-fill" d="M304.6 231.8c0 55.1-44.7 99.8-99.8 99.8S105 286.9 105 231.8c0-55.1 44.7-99.8 99.8-99.8 55.1 0 99.8 44.7 99.8 99.8z"></path><path class="lineal-stroke" d="M204.8 343.2c-61.5 0-111.4-49.9-111.4-111.4 0-61.5 49.9-111.4 111.4-111.4 61.5 0 111.4 49.9 111.4 111.4 0 61.5-49.9 111.4-111.4 111.4zm0-199.5c-48.7 0-88.1 39.5-88.1 88.1s39.5 88.1 88.1 88.1 88.1-39.5 88.1-88.1c0-48.7-39.4-88.1-88.1-88.1z"></path><path class="lineal-stroke" d="M204.8 286.5c-30.2 0-54.8-24.5-54.8-54.8s24.5-54.8 54.8-54.8c6.4 0 11.7 5.2 11.7 11.6 0 6.4-5.2 11.7-11.7 11.7-17.4 0-31.5 14.1-31.5 31.4s14.1 31.5 31.4 31.5 31.5-14.1 31.5-31.4c0-6.4 5.2-11.6 11.7-11.6 6.4 0 11.6 5.2 11.6 11.6 0 30.3-24.5 54.8-54.7 54.8zm139.8-158.4H298c-6.4.2-11.8-4.9-12-11.3-.2-6.4 4.9-11.8 11.3-12h47.3c6.4-.2 11.8 4.9 12 11.3.2 6.4-4.9 11.8-11.3 12h-.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">photo-camera</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/photo-camera.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/photo-camera.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/picture.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="316.6" cy="102.2" r="51.5"></circle><path class="lineal-stroke" d="M316.6 167.9c-36.3 0-65.7-29.4-65.7-65.7s29.4-65.7 65.7-65.7 65.7 29.4 65.7 65.7c0 36.3-29.4 65.7-65.7 65.7zm0-102.9c-20.6 0-37.2 16.7-37.2 37.2s16.7 37.2 37.2 37.2 37.2-16.7 37.2-37.2c0-20.5-16.6-37.2-37.2-37.2z"></path><path class="lineal-fill" d="M319 397.1L192.9 164.3 38.3 397.1z"></path><path class="lineal-stroke" d="M319 411.3H38.3c-7.9 0-14.2-6.4-14.2-14.2 0-2.8.8-5.5 2.4-7.9L181 156.4c4.3-6.5 13.2-8.3 19.7-4 1.9 1.3 3.5 3 4.6 5.1l126.2 232.8c3.7 6.9 1.2 15.5-5.7 19.3-2.1 1.1-4.4 1.7-6.8 1.7zM64.8 382.9h230.3l-103.5-191-126.8 191z"></path><path class="lineal-fill" d="M473.7 397.1L347.6 243 221.4 397.1z"></path><path class="lineal-stroke" d="M473.7 411.3H221.4c-7.9 0-14.2-6.4-14.2-14.2 0-3.3 1.1-6.5 3.2-9L336.6 234c5-6.1 13.9-7 20-2 .7.6 1.4 1.3 2 2l126.2 154.1c5 6.1 4.1 15-2 20-2.6 2.1-5.8 3.2-9.1 3.2zm-222.2-28.4h192.2l-96.1-117.4-96.1 117.4z"></path><path class="lineal-stroke" d="M472.8 412.3H39.2C17.6 412.2 0 394.7 0 373.1V39.2C0 17.6 17.6 0 39.2 0h433.6C494.4 0 512 17.6 512 39.2v333.9c0 21.6-17.6 39.1-39.2 39.2zM39.2 28.5c-5.9 0-10.7 4.8-10.8 10.8v333.9c0 5.9 4.8 10.7 10.8 10.7h433.6c5.9 0 10.7-4.8 10.8-10.7v-334c0-5.9-4.8-10.7-10.8-10.8H39.2z"></path><path class="lineal-stroke" d="M123.7 87.6H14.2c-7.9.2-14.4-6-14.6-13.8s6-14.4 13.8-14.6h110.3c7.9-.2 14.4 6 14.6 13.8.2 7.9-6 14.4-13.8 14.6h-.8zm-27 57.8H14.2C6.3 145.4 0 139 0 131.2c0-7.9 6.4-14.2 14.2-14.2h82.4c7.9 0 14.2 6.4 14.2 14.2.1 7.9-6.3 14.2-14.1 14.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/picture.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="316.6" cy="102.2" r="51.5"></circle><path class="lineal-stroke" d="M316.6 167.9c-36.3 0-65.7-29.4-65.7-65.7s29.4-65.7 65.7-65.7 65.7 29.4 65.7 65.7c0 36.3-29.4 65.7-65.7 65.7zm0-102.9c-20.6 0-37.2 16.7-37.2 37.2s16.7 37.2 37.2 37.2 37.2-16.7 37.2-37.2c0-20.5-16.6-37.2-37.2-37.2z"></path><path class="lineal-fill" d="M319 397.1L192.9 164.3 38.3 397.1z"></path><path class="lineal-stroke" d="M319 411.3H38.3c-7.9 0-14.2-6.4-14.2-14.2 0-2.8.8-5.5 2.4-7.9L181 156.4c4.3-6.5 13.2-8.3 19.7-4 1.9 1.3 3.5 3 4.6 5.1l126.2 232.8c3.7 6.9 1.2 15.5-5.7 19.3-2.1 1.1-4.4 1.7-6.8 1.7zM64.8 382.9h230.3l-103.5-191-126.8 191z"></path><path class="lineal-fill" d="M473.7 397.1L347.6 243 221.4 397.1z"></path><path class="lineal-stroke" d="M473.7 411.3H221.4c-7.9 0-14.2-6.4-14.2-14.2 0-3.3 1.1-6.5 3.2-9L336.6 234c5-6.1 13.9-7 20-2 .7.6 1.4 1.3 2 2l126.2 154.1c5 6.1 4.1 15-2 20-2.6 2.1-5.8 3.2-9.1 3.2zm-222.2-28.4h192.2l-96.1-117.4-96.1 117.4z"></path><path class="lineal-stroke" d="M472.8 412.3H39.2C17.6 412.2 0 394.7 0 373.1V39.2C0 17.6 17.6 0 39.2 0h433.6C494.4 0 512 17.6 512 39.2v333.9c0 21.6-17.6 39.1-39.2 39.2zM39.2 28.5c-5.9 0-10.7 4.8-10.8 10.8v333.9c0 5.9 4.8 10.7 10.8 10.7h433.6c5.9 0 10.7-4.8 10.8-10.7v-334c0-5.9-4.8-10.7-10.8-10.8H39.2z"></path><path class="lineal-stroke" d="M123.7 87.6H14.2c-7.9.2-14.4-6-14.6-13.8s6-14.4 13.8-14.6h110.3c7.9-.2 14.4 6 14.6 13.8.2 7.9-6 14.4-13.8 14.6h-.8zm-27 57.8H14.2C6.3 145.4 0 139 0 131.2c0-7.9 6.4-14.2 14.2-14.2h82.4c7.9 0 14.2 6.4 14.2 14.2.1 7.9-6.3 14.2-14.1 14.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">picture</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/picture.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/picture.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pictures.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="339.5" cy="247.2" r="43.7"></circle><path class="lineal-stroke" d="M339.5 304.6c-31.6 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4-25.7 57.4-57.4 57.4zm0-87.5c-16.6 0-30.1 13.5-30.1 30.1s13.5 30.1 30.1 30.1 30.1-13.5 30.1-30.1-13.5-30.1-30.1-30.1z"></path><path class="lineal-fill" d="M346.4 443.4L239.2 269.7 107.9 443.4z"></path><path class="lineal-stroke" d="M346.4 457H107.9c-5.2 0-9.9-2.9-12.2-7.6-2.3-4.6-1.8-10.2 1.3-14.3l131.4-173.6c2.7-3.6 7-5.6 11.5-5.4 4.5.2 8.6 2.6 11 6.5l107.2 173.6c2.6 4.2 2.7 9.5.3 13.8-2.4 4.3-7 7-12 7zm-211.1-27.3H322l-83.9-135.8-102.8 135.8z"></path><path class="lineal-fill" d="M477.9 443.4L370.7 324.5 263.5 443.4z"></path><path class="lineal-stroke" d="M477.9 457H263.5c-5.4 0-10.3-3.2-12.5-8.1-2.2-4.9-1.3-10.7 2.3-14.7l107.2-118.9c2.6-2.9 6.3-4.5 10.1-4.5s7.6 1.6 10.1 4.5L488 434.2c3.6 4 4.5 9.8 2.3 14.7-2.1 4.9-7 8.1-12.4 8.1zm-183.7-27.3h153l-76.5-84.8-76.5 84.8z"></path><path class="lineal-stroke" d="M477.1 457.5H108.6c-19.2 0-34.9-15.6-34.9-34.9V163.1c0-19.2 15.6-34.9 34.9-34.9h368.5c19.2 0 34.9 15.6 34.9 34.9v193.4c0 7.5-6.1 13.7-13.7 13.7s-13.7-6.1-13.7-13.7V163.1c0-4.2-3.4-7.6-7.6-7.6H108.6c-4.2 0-7.6 3.4-7.6 7.6v259.5c0 4.2 3.4 7.6 7.6 7.6h368.5c7.5 0 13.7 6.1 13.7 13.7s-6.1 13.6-13.7 13.6z"></path><path class="lineal-fill" d="M87.4 163.1c0-11.7 9.5-21.2 21.2-21.2h315.9V89.3c0-11.7-9.5-21.2-21.2-21.2H34.9c-11.7 0-21.2 9.5-21.2 21.2v259.5c0 11.7 9.5 21.2 21.2 21.2h52.5V163.1z"></path><path class="lineal-stroke" d="M403.4 54.5H34.9C15.6 54.5 0 70.1 0 89.3v259.5c0 19.2 15.6 34.9 34.9 34.9h52.5c7.5 0 13.7-6.1 13.7-13.7V255h56.4c7.5 0 13.7-6.1 13.7-13.7 0-7.5-6.1-13.7-13.7-13.7h-56.4v-21.9h79.4c7.5 0 13.7-6.1 13.7-13.7 0-7.5-6.1-13.7-13.7-13.7h-79.4v-15.4c0-4.2 3.4-7.6 7.6-7.6h315.9c7.5 0 13.7-6.1 13.7-13.7V89.3c-.1-19.2-15.7-34.8-34.9-34.8zm7.5 73.7H108.6c-19.2 0-34.9 15.6-34.9 34.9v193.2H34.9c-4.2 0-7.6-3.4-7.6-7.6V89.3c0-4.2 3.4-7.6 7.6-7.6h368.5c4.2 0 7.6 3.4 7.6 7.6v38.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pictures.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="339.5" cy="247.2" r="43.7"></circle><path class="lineal-stroke" d="M339.5 304.6c-31.6 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4-25.7 57.4-57.4 57.4zm0-87.5c-16.6 0-30.1 13.5-30.1 30.1s13.5 30.1 30.1 30.1 30.1-13.5 30.1-30.1-13.5-30.1-30.1-30.1z"></path><path class="lineal-fill" d="M346.4 443.4L239.2 269.7 107.9 443.4z"></path><path class="lineal-stroke" d="M346.4 457H107.9c-5.2 0-9.9-2.9-12.2-7.6-2.3-4.6-1.8-10.2 1.3-14.3l131.4-173.6c2.7-3.6 7-5.6 11.5-5.4 4.5.2 8.6 2.6 11 6.5l107.2 173.6c2.6 4.2 2.7 9.5.3 13.8-2.4 4.3-7 7-12 7zm-211.1-27.3H322l-83.9-135.8-102.8 135.8z"></path><path class="lineal-fill" d="M477.9 443.4L370.7 324.5 263.5 443.4z"></path><path class="lineal-stroke" d="M477.9 457H263.5c-5.4 0-10.3-3.2-12.5-8.1-2.2-4.9-1.3-10.7 2.3-14.7l107.2-118.9c2.6-2.9 6.3-4.5 10.1-4.5s7.6 1.6 10.1 4.5L488 434.2c3.6 4 4.5 9.8 2.3 14.7-2.1 4.9-7 8.1-12.4 8.1zm-183.7-27.3h153l-76.5-84.8-76.5 84.8z"></path><path class="lineal-stroke" d="M477.1 457.5H108.6c-19.2 0-34.9-15.6-34.9-34.9V163.1c0-19.2 15.6-34.9 34.9-34.9h368.5c19.2 0 34.9 15.6 34.9 34.9v193.4c0 7.5-6.1 13.7-13.7 13.7s-13.7-6.1-13.7-13.7V163.1c0-4.2-3.4-7.6-7.6-7.6H108.6c-4.2 0-7.6 3.4-7.6 7.6v259.5c0 4.2 3.4 7.6 7.6 7.6h368.5c7.5 0 13.7 6.1 13.7 13.7s-6.1 13.6-13.7 13.6z"></path><path class="lineal-fill" d="M87.4 163.1c0-11.7 9.5-21.2 21.2-21.2h315.9V89.3c0-11.7-9.5-21.2-21.2-21.2H34.9c-11.7 0-21.2 9.5-21.2 21.2v259.5c0 11.7 9.5 21.2 21.2 21.2h52.5V163.1z"></path><path class="lineal-stroke" d="M403.4 54.5H34.9C15.6 54.5 0 70.1 0 89.3v259.5c0 19.2 15.6 34.9 34.9 34.9h52.5c7.5 0 13.7-6.1 13.7-13.7V255h56.4c7.5 0 13.7-6.1 13.7-13.7 0-7.5-6.1-13.7-13.7-13.7h-56.4v-21.9h79.4c7.5 0 13.7-6.1 13.7-13.7 0-7.5-6.1-13.7-13.7-13.7h-79.4v-15.4c0-4.2 3.4-7.6 7.6-7.6h315.9c7.5 0 13.7-6.1 13.7-13.7V89.3c-.1-19.2-15.7-34.8-34.9-34.8zm7.5 73.7H108.6c-19.2 0-34.9 15.6-34.9 34.9v193.2H34.9c-4.2 0-7.6-3.4-7.6-7.6V89.3c0-4.2 3.4-7.6 7.6-7.6h368.5c4.2 0 7.6 3.4 7.6 7.6v38.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pictures</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pictures.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pictures.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pie-chart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M438.3 285.5H226.2l137.4 161.4c47.5-40.2 74.8-99.3 74.7-161.4z"></path><path class="lineal-stroke" d="M453 285.5c0-8.1-6.6-14.7-14.7-14.7H241v-197c0-8.1-6.6-14.7-14.7-14.8h-.1C101.5 59.1 0 160.8 0 285.5 0 410.4 101.6 512 226.5 512c53.7 0 105.7-19.1 146.7-53.9C423.9 415 453 351.9 453 285.5zm-423.6 0c0-103.5 80.4-188.8 182-196.5v181.7H108.7c-8.1.2-14.6 7-14.4 15.1.2 7.8 6.5 14.1 14.4 14.4h110.8l123.1 144.5c-33.7 24.5-74.3 37.8-116 37.8-108.7 0-197.1-88.4-197.2-197zM365 425.7L258.1 300.2H423c-3.5 47.5-24.1 92-58 125.5z"></path><path class="lineal-stroke" d="M492.2 134l-1.1-2.5c-11.1-23.9-26.2-45.7-44.8-64.4l-2.6-2.6C424.8 46 402.9 31 378.8 20l-2.3-1c-28.7-12.5-59.7-19-91-19h-.5c-8.1.1-14.5 6.7-14.5 14.7v211.8c0 8.1 6.6 14.7 14.7 14.7h105.5c.5 0 1 0 1.5-.1h.1c.5 0 .9-.1 1.3-.2l.4-.1c.4-.1.7-.2 1-.3l.4-.1c.3-.1.6-.2 1-.4.1-.1.2-.1.4-.2.3-.1.6-.3.9-.4l.3-.2.9-.6.3-.2.9-.6.2-.2c.3-.2.5-.5.8-.7l71.6-71.6c6.5 19.7 9.7 40.4 9.7 61.2-.2 8.1 6.2 14.9 14.4 15.1s14.9-6.2 15.1-14.4v-.8c.1-31.8-6.6-63.3-19.7-92.4zm-192.3-8.4l74.8-74.8c13.9 7.1 26.9 15.8 38.7 25.9L299.9 190.3v-64.7zm45.3-86.9L299.9 84V30c15.4 1.1 30.6 4 45.3 8.7zm39.5 173h-64.6L434.3 97.5c10.2 11.8 19 24.7 26.1 38.5l-75.7 75.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pie-chart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M438.3 285.5H226.2l137.4 161.4c47.5-40.2 74.8-99.3 74.7-161.4z"></path><path class="lineal-stroke" d="M453 285.5c0-8.1-6.6-14.7-14.7-14.7H241v-197c0-8.1-6.6-14.7-14.7-14.8h-.1C101.5 59.1 0 160.8 0 285.5 0 410.4 101.6 512 226.5 512c53.7 0 105.7-19.1 146.7-53.9C423.9 415 453 351.9 453 285.5zm-423.6 0c0-103.5 80.4-188.8 182-196.5v181.7H108.7c-8.1.2-14.6 7-14.4 15.1.2 7.8 6.5 14.1 14.4 14.4h110.8l123.1 144.5c-33.7 24.5-74.3 37.8-116 37.8-108.7 0-197.1-88.4-197.2-197zM365 425.7L258.1 300.2H423c-3.5 47.5-24.1 92-58 125.5z"></path><path class="lineal-stroke" d="M492.2 134l-1.1-2.5c-11.1-23.9-26.2-45.7-44.8-64.4l-2.6-2.6C424.8 46 402.9 31 378.8 20l-2.3-1c-28.7-12.5-59.7-19-91-19h-.5c-8.1.1-14.5 6.7-14.5 14.7v211.8c0 8.1 6.6 14.7 14.7 14.7h105.5c.5 0 1 0 1.5-.1h.1c.5 0 .9-.1 1.3-.2l.4-.1c.4-.1.7-.2 1-.3l.4-.1c.3-.1.6-.2 1-.4.1-.1.2-.1.4-.2.3-.1.6-.3.9-.4l.3-.2.9-.6.3-.2.9-.6.2-.2c.3-.2.5-.5.8-.7l71.6-71.6c6.5 19.7 9.7 40.4 9.7 61.2-.2 8.1 6.2 14.9 14.4 15.1s14.9-6.2 15.1-14.4v-.8c.1-31.8-6.6-63.3-19.7-92.4zm-192.3-8.4l74.8-74.8c13.9 7.1 26.9 15.8 38.7 25.9L299.9 190.3v-64.7zm45.3-86.9L299.9 84V30c15.4 1.1 30.6 4 45.3 8.7zm39.5 173h-64.6L434.3 97.5c10.2 11.8 19 24.7 26.1 38.5l-75.7 75.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pie-chart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pie-chart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pie-chart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 408.1 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pie-chart-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M396.3 192.3h-33.4c-6.4 0-11.6-5.2-11.6-11.6 0-6.4 5.2-11.6 11.6-11.6h19.7C363.2 71.1 268.1 7.3 170.1 26.6c-4.2.8-8.4 1.8-12.6 2.9L235.1 169h72c6.4 0 11.6 5.2 11.6 11.6 0 6.4-5.2 11.6-11.6 11.6h-78.9c-4.2 0-8.1-2.3-10.1-6l-87.9-158c-3.1-5.6-1.1-12.6 4.5-15.7.7-.4 1.5-.7 2.3-1l8.1-2.5c107.8-33.1 222 27.4 255.1 135.2 2.7 8.7 4.8 17.6 6.3 26.6l1.3 8c1.1 6.3-3.2 12.3-9.5 13.3-.7.2-1.3.2-2 .2zM204.6 409.6c-20.4-.1-40.6-3.2-60.1-9.2l-8.1-2.5c-6.1-1.9-9.6-8.4-7.7-14.5.2-.8.6-1.5 1-2.2l88.4-158.3c2.1-3.7 5.9-5.9 10.1-5.9h33.2c6.4.2 11.4 5.5 11.2 11.9-.2 6.1-5.1 11.1-11.2 11.2H235l-78 139.8c96.8 26.3 196.6-30.9 222.9-127.8 1.1-4 2-8 2.8-12h-65.4c-6.4.2-11.7-4.8-11.9-11.2-.2-6.4 4.8-11.7 11.2-11.9h79.8c6.4 0 11.6 5.2 11.6 11.6 0 .6-.1 1.3-.2 1.9l-1.3 7.9C390 337 304.7 409.4 204.6 409.6z"></path><path class="lineal-fill" d="M93 361.8C6 300.1-14.5 179.6 47.1 92.6c12.7-17.9 28.4-33.5 46.3-46.2l6.2-4.4 90 161.7-90.4 162.5-6.2-4.4z"></path><path class="lineal-stroke" d="M99.2 377.8c-2.4 0-4.7-.7-6.7-2.1l-6.2-4.4C-5.9 305.9-27.7 178.2 37.7 86c13.5-19 30-35.5 49.1-48.9l6.2-4.4c5.2-3.7 12.4-2.4 16.1 2.8.2.3.5.7.7 1.1l90 161.7c1.9 3.5 1.9 7.8 0 11.3L109.4 372c-1.6 2.9-4.3 4.9-7.6 5.7-.8 0-1.7.1-2.6.1zM95.8 59C15.6 119.1-.7 232.9 59.4 313.1c10.2 13.7 22.4 25.8 36 36.1l81-145.4L95.8 59z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 408.1 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pie-chart-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M396.3 192.3h-33.4c-6.4 0-11.6-5.2-11.6-11.6 0-6.4 5.2-11.6 11.6-11.6h19.7C363.2 71.1 268.1 7.3 170.1 26.6c-4.2.8-8.4 1.8-12.6 2.9L235.1 169h72c6.4 0 11.6 5.2 11.6 11.6 0 6.4-5.2 11.6-11.6 11.6h-78.9c-4.2 0-8.1-2.3-10.1-6l-87.9-158c-3.1-5.6-1.1-12.6 4.5-15.7.7-.4 1.5-.7 2.3-1l8.1-2.5c107.8-33.1 222 27.4 255.1 135.2 2.7 8.7 4.8 17.6 6.3 26.6l1.3 8c1.1 6.3-3.2 12.3-9.5 13.3-.7.2-1.3.2-2 .2zM204.6 409.6c-20.4-.1-40.6-3.2-60.1-9.2l-8.1-2.5c-6.1-1.9-9.6-8.4-7.7-14.5.2-.8.6-1.5 1-2.2l88.4-158.3c2.1-3.7 5.9-5.9 10.1-5.9h33.2c6.4.2 11.4 5.5 11.2 11.9-.2 6.1-5.1 11.1-11.2 11.2H235l-78 139.8c96.8 26.3 196.6-30.9 222.9-127.8 1.1-4 2-8 2.8-12h-65.4c-6.4.2-11.7-4.8-11.9-11.2-.2-6.4 4.8-11.7 11.2-11.9h79.8c6.4 0 11.6 5.2 11.6 11.6 0 .6-.1 1.3-.2 1.9l-1.3 7.9C390 337 304.7 409.4 204.6 409.6z"></path><path class="lineal-fill" d="M93 361.8C6 300.1-14.5 179.6 47.1 92.6c12.7-17.9 28.4-33.5 46.3-46.2l6.2-4.4 90 161.7-90.4 162.5-6.2-4.4z"></path><path class="lineal-stroke" d="M99.2 377.8c-2.4 0-4.7-.7-6.7-2.1l-6.2-4.4C-5.9 305.9-27.7 178.2 37.7 86c13.5-19 30-35.5 49.1-48.9l6.2-4.4c5.2-3.7 12.4-2.4 16.1 2.8.2.3.5.7.7 1.1l90 161.7c1.9 3.5 1.9 7.8 0 11.3L109.4 372c-1.6 2.9-4.3 4.9-7.6 5.7-.8 0-1.7.1-2.6.1zM95.8 59C15.6 119.1-.7 232.9 59.4 313.1c10.2 13.7 22.4 25.8 36 36.1l81-145.4L95.8 59z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pie-chart-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pie-chart-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pie-chart-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 386.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pin.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="193.4" cy="193.4" r="96.8"></circle><path class="lineal-stroke" d="M193.4 304.5c-61.4 0-111.1-49.7-111.1-111.1S132 82.2 193.3 82.2 304.5 132 304.5 193.3c-.1 61.4-49.8 111.1-111.1 111.2zm0-193.6c-45.5 0-82.4 36.9-82.4 82.4s36.9 82.4 82.4 82.4 82.4-36.9 82.4-82.4c-.1-45.4-37-82.3-82.4-82.4z"></path><path class="lineal-stroke" d="M193.4 0C86.7 0 0 86.7 0 193.4c0 69.7 37.6 134 98.3 168.3L181 504.9c4 6.9 12.8 9.2 19.6 5.2 2.2-1.3 4-3.1 5.2-5.2l84-145.5c4.4-6.6 2.7-15.5-3.9-19.9-6.6-4.4-15.5-2.7-19.9 3.9-.4.5-.7 1.1-1 1.7l-71.6 124-51.5-89.2c16.8 4.6 34.1 7 51.5 7 7.9 0 14.4-6.4 14.4-14.4s-6.4-14.4-14.4-14.4c-90.8 0-164.7-73.9-164.7-164.7S102.6 28.7 193.4 28.7 358 102.6 358 193.4c0 40.8-15.1 80.2-42.5 110.4-5.5 5.7-5.4 14.8.3 20.3s14.8 5.4 20.3-.3c.2-.2.5-.5.7-.8 32.2-35.5 50-81.7 49.9-129.6C386.7 86.7 300 0 193.4 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 386.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pin.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="193.4" cy="193.4" r="96.8"></circle><path class="lineal-stroke" d="M193.4 304.5c-61.4 0-111.1-49.7-111.1-111.1S132 82.2 193.3 82.2 304.5 132 304.5 193.3c-.1 61.4-49.8 111.1-111.1 111.2zm0-193.6c-45.5 0-82.4 36.9-82.4 82.4s36.9 82.4 82.4 82.4 82.4-36.9 82.4-82.4c-.1-45.4-37-82.3-82.4-82.4z"></path><path class="lineal-stroke" d="M193.4 0C86.7 0 0 86.7 0 193.4c0 69.7 37.6 134 98.3 168.3L181 504.9c4 6.9 12.8 9.2 19.6 5.2 2.2-1.3 4-3.1 5.2-5.2l84-145.5c4.4-6.6 2.7-15.5-3.9-19.9-6.6-4.4-15.5-2.7-19.9 3.9-.4.5-.7 1.1-1 1.7l-71.6 124-51.5-89.2c16.8 4.6 34.1 7 51.5 7 7.9 0 14.4-6.4 14.4-14.4s-6.4-14.4-14.4-14.4c-90.8 0-164.7-73.9-164.7-164.7S102.6 28.7 193.4 28.7 358 102.6 358 193.4c0 40.8-15.1 80.2-42.5 110.4-5.5 5.7-5.4 14.8.3 20.3s14.8 5.4 20.3-.3c.2-.2.5-.5.7-.8 32.2-35.5 50-81.7 49.9-129.6C386.7 86.7 300 0 193.4 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pin</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pin.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pin.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 382.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pin-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="191.4" cy="192" r="106.2"></circle><path class="lineal-stroke" d="M191.4 312.6c-66.6 0-120.6-54-120.6-120.6s54-120.6 120.6-120.6S312 125.4 312 192c-.1 66.6-54.1 120.5-120.6 120.6zm0-212.5c-50.7 0-91.9 41.1-91.9 91.9s41.1 91.9 91.9 91.9c50.7 0 91.9-41.1 91.9-91.9-.1-50.7-41.2-91.8-91.9-91.9z"></path><path class="lineal-stroke" d="M191.4 512c-3.6 0-7.1-1.3-9.7-3.8-1.8-1.7-45.7-42.2-90.2-101.2C30.8 326.7 0 254.1 0 191.4c-.1-29.6 6.8-58.9 20-85.4 3.4-7.2 11.9-10.3 19.1-6.9S49.4 111 46 118.2l-.3.6c-11.3 22.5-17.1 47.4-17 72.5 0 116.8 126.3 250.3 162.7 286.4 11-10.9 30.3-30.6 51.6-56 5.1-6.1 14.2-6.9 20.2-1.8s6.9 14.2 1.8 20.2c-34.3 40.8-62.7 66.9-63.9 68-2.7 2.5-6.2 3.9-9.7 3.9zm110.1-129.4c-7.9 0-14.4-6.4-14.3-14.4 0-2.9.9-5.6 2.4-8C332.3 296.9 354 240 354 191.3c0-89.7-73-162.6-162.6-162.6-34.6-.1-68.3 10.9-96.2 31.5-6.4 4.7-15.4 3.3-20.1-3.1S71.8 41.7 78.2 37C111 12.9 150.6-.1 191.4 0c105.5 0 191.4 85.8 191.4 191.4 0 54.5-23.3 116.8-69.2 184.9-2.8 3.9-7.3 6.3-12.1 6.3z"></path><path class="lineal-stroke" d="M183.6 235.1c-3.8 0-7.5-1.5-10.1-4.2L134.6 192c-5.6-5.6-5.6-14.7 0-20.3s14.7-5.6 20.3 0l28.8 28.8 44.4-44.4c5.7-5.5 14.8-5.4 20.3.4 5.4 5.6 5.4 14.4 0 19.9l-54.5 54.5c-2.9 2.6-6.5 4.2-10.3 4.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 382.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/pin-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="191.4" cy="192" r="106.2"></circle><path class="lineal-stroke" d="M191.4 312.6c-66.6 0-120.6-54-120.6-120.6s54-120.6 120.6-120.6S312 125.4 312 192c-.1 66.6-54.1 120.5-120.6 120.6zm0-212.5c-50.7 0-91.9 41.1-91.9 91.9s41.1 91.9 91.9 91.9c50.7 0 91.9-41.1 91.9-91.9-.1-50.7-41.2-91.8-91.9-91.9z"></path><path class="lineal-stroke" d="M191.4 512c-3.6 0-7.1-1.3-9.7-3.8-1.8-1.7-45.7-42.2-90.2-101.2C30.8 326.7 0 254.1 0 191.4c-.1-29.6 6.8-58.9 20-85.4 3.4-7.2 11.9-10.3 19.1-6.9S49.4 111 46 118.2l-.3.6c-11.3 22.5-17.1 47.4-17 72.5 0 116.8 126.3 250.3 162.7 286.4 11-10.9 30.3-30.6 51.6-56 5.1-6.1 14.2-6.9 20.2-1.8s6.9 14.2 1.8 20.2c-34.3 40.8-62.7 66.9-63.9 68-2.7 2.5-6.2 3.9-9.7 3.9zm110.1-129.4c-7.9 0-14.4-6.4-14.3-14.4 0-2.9.9-5.6 2.4-8C332.3 296.9 354 240 354 191.3c0-89.7-73-162.6-162.6-162.6-34.6-.1-68.3 10.9-96.2 31.5-6.4 4.7-15.4 3.3-20.1-3.1S71.8 41.7 78.2 37C111 12.9 150.6-.1 191.4 0c105.5 0 191.4 85.8 191.4 191.4 0 54.5-23.3 116.8-69.2 184.9-2.8 3.9-7.3 6.3-12.1 6.3z"></path><path class="lineal-stroke" d="M183.6 235.1c-3.8 0-7.5-1.5-10.1-4.2L134.6 192c-5.6-5.6-5.6-14.7 0-20.3s14.7-5.6 20.3 0l28.8 28.8 44.4-44.4c5.7-5.5 14.8-5.4 20.3.4 5.4 5.6 5.4 14.4 0 19.9l-54.5 54.5c-2.9 2.6-6.5 4.2-10.3 4.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pin-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pin-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/pin-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 499.03 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/plan.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M249.52 125.57a62.79 62.79 0 1162.78-62.78 62.85 62.85 0 01-62.78 62.78zm0-97a34.25 34.25 0 1034.24 34.25 34.28 34.28 0 00-34.24-34.28z"></path><path class="lineal-stroke" d="M424 512H35.75A35.78 35.78 0 010 476.25V105.94A35.78 35.78 0 0135.75 70.2h427.53A35.79 35.79 0 01499 105.94v310.34a14.27 14.27 0 01-28.54 0V105.94a7.21 7.21 0 00-7.21-7.2H35.75a7.21 7.21 0 00-7.21 7.2v370.31a7.21 7.21 0 007.21 7.21H424a14.27 14.27 0 010 28.54z"></path><path class="lineal-fill" d="M484.76 157.29v-51.35a21.48 21.48 0 00-21.48-21.47H35.75a21.47 21.47 0 00-21.48 21.47v51.35z"></path><path class="lineal-stroke" d="M484.76 171.56H14.27A14.27 14.27 0 010 157.29v-51.35A35.79 35.79 0 0135.75 70.2h427.53A35.79 35.79 0 01499 105.94v51.35a14.27 14.27 0 01-14.24 14.27zM28.54 143h442v-37.06a7.21 7.21 0 00-7.21-7.2H35.75a7.21 7.21 0 00-7.21 7.2z"></path><path class="lineal-fill" d="M116.93 285h-7.61a31.15 31.15 0 01-31.15-31.16 31.15 31.15 0 0131.15-31.15h7.61a31.15 31.15 0 0131.15 31.15A31.14 31.14 0 01116.93 285z"></path><path class="lineal-stroke" d="M116.93 299.27h-7.61a45.43 45.43 0 010-90.85h7.61a45.43 45.43 0 110 90.85zM109.32 237a16.89 16.89 0 000 33.77h7.61a16.89 16.89 0 100-33.77zm175.16 62.27A14.27 14.27 0 01270.21 285v-48h-41.39v48a14.27 14.27 0 11-28.53 0v-62.31a14.26 14.26 0 0114.26-14.27h69.93a14.27 14.27 0 0114.27 14.27V285a14.27 14.27 0 01-14.27 14.27z"></path><path class="lineal-fill" d="M350.94 222.69h69.92V285h-69.92z"></path><path class="lineal-stroke" d="M420.86 299.27h-69.92A14.27 14.27 0 01336.67 285v-62.31a14.27 14.27 0 0114.27-14.27h69.92a14.27 14.27 0 0114.27 14.27V285a14.27 14.27 0 01-14.27 14.27zm-55.65-28.54h41.39V237h-41.39z"></path><path class="lineal-fill" d="M78.16 353.97h69.92v62.31H78.16z"></path><path class="lineal-stroke" d="M148.09 430.55H78.17a14.27 14.27 0 01-14.27-14.27V354a14.27 14.27 0 0114.27-14.3h69.92a14.27 14.27 0 0114.27 14.3v62.31a14.27 14.27 0 01-14.27 14.24zM92.44 402h41.38v-33.76H92.44z"></path><path class="lineal-fill" d="M253.32 416.28h-7.61a31.16 31.16 0 01-31.16-31.16A31.16 31.16 0 01245.71 354h7.61a31.15 31.15 0 0131.15 31.15 31.14 31.14 0 01-31.15 31.13z"></path><path class="lineal-stroke" d="M253.32 430.55h-7.61a45.43 45.43 0 010-90.85h7.61a45.43 45.43 0 110 90.85zm-7.61-62.31a16.89 16.89 0 100 33.77h7.61a16.89 16.89 0 000-33.77zm175.15 62.31a14.27 14.27 0 01-14.26-14.27v-48h-41.39v48a14.27 14.27 0 11-28.54 0V354a14.27 14.27 0 0114.27-14.27h69.92A14.27 14.27 0 01435.13 354v62.31a14.27 14.27 0 01-14.27 14.24z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 499.03 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/plan.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M249.52 125.57a62.79 62.79 0 1162.78-62.78 62.85 62.85 0 01-62.78 62.78zm0-97a34.25 34.25 0 1034.24 34.25 34.28 34.28 0 00-34.24-34.28z"></path><path class="lineal-stroke" d="M424 512H35.75A35.78 35.78 0 010 476.25V105.94A35.78 35.78 0 0135.75 70.2h427.53A35.79 35.79 0 01499 105.94v310.34a14.27 14.27 0 01-28.54 0V105.94a7.21 7.21 0 00-7.21-7.2H35.75a7.21 7.21 0 00-7.21 7.2v370.31a7.21 7.21 0 007.21 7.21H424a14.27 14.27 0 010 28.54z"></path><path class="lineal-fill" d="M484.76 157.29v-51.35a21.48 21.48 0 00-21.48-21.47H35.75a21.47 21.47 0 00-21.48 21.47v51.35z"></path><path class="lineal-stroke" d="M484.76 171.56H14.27A14.27 14.27 0 010 157.29v-51.35A35.79 35.79 0 0135.75 70.2h427.53A35.79 35.79 0 01499 105.94v51.35a14.27 14.27 0 01-14.24 14.27zM28.54 143h442v-37.06a7.21 7.21 0 00-7.21-7.2H35.75a7.21 7.21 0 00-7.21 7.2z"></path><path class="lineal-fill" d="M116.93 285h-7.61a31.15 31.15 0 01-31.15-31.16 31.15 31.15 0 0131.15-31.15h7.61a31.15 31.15 0 0131.15 31.15A31.14 31.14 0 01116.93 285z"></path><path class="lineal-stroke" d="M116.93 299.27h-7.61a45.43 45.43 0 010-90.85h7.61a45.43 45.43 0 110 90.85zM109.32 237a16.89 16.89 0 000 33.77h7.61a16.89 16.89 0 100-33.77zm175.16 62.27A14.27 14.27 0 01270.21 285v-48h-41.39v48a14.27 14.27 0 11-28.53 0v-62.31a14.26 14.26 0 0114.26-14.27h69.93a14.27 14.27 0 0114.27 14.27V285a14.27 14.27 0 01-14.27 14.27z"></path><path class="lineal-fill" d="M350.94 222.69h69.92V285h-69.92z"></path><path class="lineal-stroke" d="M420.86 299.27h-69.92A14.27 14.27 0 01336.67 285v-62.31a14.27 14.27 0 0114.27-14.27h69.92a14.27 14.27 0 0114.27 14.27V285a14.27 14.27 0 01-14.27 14.27zm-55.65-28.54h41.39V237h-41.39z"></path><path class="lineal-fill" d="M78.16 353.97h69.92v62.31H78.16z"></path><path class="lineal-stroke" d="M148.09 430.55H78.17a14.27 14.27 0 01-14.27-14.27V354a14.27 14.27 0 0114.27-14.3h69.92a14.27 14.27 0 0114.27 14.3v62.31a14.27 14.27 0 01-14.27 14.24zM92.44 402h41.38v-33.76H92.44z"></path><path class="lineal-fill" d="M253.32 416.28h-7.61a31.16 31.16 0 01-31.16-31.16A31.16 31.16 0 01245.71 354h7.61a31.15 31.15 0 0131.15 31.15 31.14 31.14 0 01-31.15 31.13z"></path><path class="lineal-stroke" d="M253.32 430.55h-7.61a45.43 45.43 0 010-90.85h7.61a45.43 45.43 0 110 90.85zm-7.61-62.31a16.89 16.89 0 100 33.77h7.61a16.89 16.89 0 000-33.77zm175.15 62.31a14.27 14.27 0 01-14.26-14.27v-48h-41.39v48a14.27 14.27 0 11-28.54 0V354a14.27 14.27 0 0114.27-14.27h69.92A14.27 14.27 0 01435.13 354v62.31a14.27 14.27 0 01-14.27 14.24z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">plan</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/plan.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/plan.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/price-tag.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M240.1 60.2H99.7L15.8 176.8v194.8h308.1V176.8L240.1 60.2zm-70.2 151.3c-27.5 0-49.8-22.3-49.8-49.9 0-27.5 22.3-49.8 49.9-49.8 27.5 0 49.8 22.3 49.8 49.9-.1 27.5-22.4 49.8-49.9 49.8z"></path><path class="lineal-stroke" d="M323.9 387.4c8.7 0 15.8-7.1 15.8-15.8V176.8c0-3.3-1.1-6.5-3-9.2L252.9 51c-3-4.1-7.7-6.6-12.8-6.6h-54.4V15.8c0-8.7-7.1-15.8-15.8-15.8s-15.8 7.1-15.8 15.8v28.6H99.7c-5.1 0-9.9 2.5-12.8 6.6L3 167.6c-1.9 2.7-3 5.9-3 9.2v319.4c0 8.7 7.1 15.8 15.8 15.8h308.1c8.7 0 15.8-7.1 15.8-15.8v-38.8c0-8.7-7.1-15.8-15.8-15.8-8.7 0-15.8 7.1-15.8 15.8v23H31.6v-93h292.3zM31.6 181.9L107.8 76h46.3v22c-35.2 8.7-56.6 44.3-47.9 79.5s44.3 56.6 79.5 47.9c35.2-8.7 56.6-44.3 47.9-79.5-5.9-23.6-24.3-42.1-47.9-47.9V76H232l76.1 105.9v173.9H31.6V181.9zm138.3-54.3c18.8 0 34 15.2 34 34s-15.2 34-34 34-34-15.2-34-34c0-18.7 15.2-33.9 34-34z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.7 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/price-tag.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M240.1 60.2H99.7L15.8 176.8v194.8h308.1V176.8L240.1 60.2zm-70.2 151.3c-27.5 0-49.8-22.3-49.8-49.9 0-27.5 22.3-49.8 49.9-49.8 27.5 0 49.8 22.3 49.8 49.9-.1 27.5-22.4 49.8-49.9 49.8z"></path><path class="lineal-stroke" d="M323.9 387.4c8.7 0 15.8-7.1 15.8-15.8V176.8c0-3.3-1.1-6.5-3-9.2L252.9 51c-3-4.1-7.7-6.6-12.8-6.6h-54.4V15.8c0-8.7-7.1-15.8-15.8-15.8s-15.8 7.1-15.8 15.8v28.6H99.7c-5.1 0-9.9 2.5-12.8 6.6L3 167.6c-1.9 2.7-3 5.9-3 9.2v319.4c0 8.7 7.1 15.8 15.8 15.8h308.1c8.7 0 15.8-7.1 15.8-15.8v-38.8c0-8.7-7.1-15.8-15.8-15.8-8.7 0-15.8 7.1-15.8 15.8v23H31.6v-93h292.3zM31.6 181.9L107.8 76h46.3v22c-35.2 8.7-56.6 44.3-47.9 79.5s44.3 56.6 79.5 47.9c35.2-8.7 56.6-44.3 47.9-79.5-5.9-23.6-24.3-42.1-47.9-47.9V76H232l76.1 105.9v173.9H31.6V181.9zm138.3-54.3c18.8 0 34 15.2 34 34s-15.2 34-34 34-34-15.2-34-34c0-18.7 15.2-33.9 34-34z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">price-tag</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/price-tag.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/price-tag.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/printer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M378.8 88.8h-55.1v75.8c0 10.5-8.5 18.9-19 18.9h-200c-10.5 0-19-8.5-19-18.9V88.8h-55c-10.5 0-18.9 8.5-19 18.9v186c0 10.5 8.5 18.9 18.9 19h348.1c10.5 0 18.9-8.5 19-19V107.8c.1-10.5-8.4-19-18.9-19z"></path><path class="lineal-stroke" d="M409.6 226V107.8c0-17-13.8-30.8-30.8-30.8h-43.2V30.8c0-17-13.8-30.8-30.8-30.8H149.2c-8.2 0-16 3.2-21.8 9L83 53.6c-5.8 5.8-9 13.6-9 21.7V77H30.8C13.8 77 0 90.8 0 107.8v185.9c0 17 13.8 30.8 30.8 30.8h281.1v49c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1v-13.9c0-6.5-5.3-11.8-11.8-11.8-6.5 0-11.8 5.3-11.8 11.8v13.9c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-49h43.2c17 0 30.8-13.8 30.8-30.8v-67.5c-.1-.1-.1-.2-.1-.2zM97.7 75.3c0-1.9.7-3.7 2.1-5l44.4-44.5c1.3-1.3 3.1-2.1 5-2.1h155.6c3.9 0 7.1 3.2 7.1 7.1v133.8c0 3.9-3.2 7.1-7.1 7.1h-200c-3.9 0-7.1-3.2-7.1-7.1V75.3zm281.1 225.5h-348c-3.9 0-7.1-3.2-7.1-7.1v-55.9h50.2c6.5 0 11.8-5.3 11.8-11.8 0-6.5-5.3-11.8-11.8-11.8H23.7V107.8c0-3.9 3.2-7.1 7.1-7.1H74v64c0 17 13.8 30.8 30.8 30.8h200c17 0 30.8-13.8 30.8-30.8v-64h43.2c3.9 0 7.1 3.2 7.1 7.1v106.4h-50.2c-6.5 0-11.8 5.3-11.8 11.8 0 6.5 5.3 11.8 11.8 11.8h50.2v55.9c0 3.9-3.2 7.1-7.1 7.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">printer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/printer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/printer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/profits.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M196.19 116.46L319.57 83.4l-33.06 123.38-90.32-90.32z"></path><path class="lineal-stroke" d="M330.72 72.25a15.72 15.72 0 00-15.23-4.08L192.1 101.23a15.77 15.77 0 00-7.1 26.38l12.05 12-80.6 80.59a15.79 15.79 0 000 22.31l43.93 43.93a15.8 15.8 0 0022.31 0L241.2 228a15.77 15.77 0 00-22.31-22.3L171.56 253l-21.62-21.6 69.44-69.4 56 56a15.77 15.77 0 0026.39-7.08L334.8 87.48a15.77 15.77 0 00-4.08-15.23zm-52.38 104.06l-51.69-51.69 70.61-18.92z"></path><path class="lineal-fill" d="M274.03 367.39h77.99v128.84h-77.99z"></path><path class="lineal-stroke" d="M496.23 423.18A15.78 15.78 0 00512 407.4v-134a15.77 15.77 0 00-15.77-15.77h-78a15.78 15.78 0 00-15.78 15.77v207.06H367.8V367.39a15.77 15.77 0 00-15.8-15.77h-78a15.77 15.77 0 00-15.77 15.77v113.07H145.6v-32.88h62.22a15.77 15.77 0 100-31.54h-78a15.77 15.77 0 00-15.77 15.77v48.65H31.54V15.77a15.77 15.77 0 00-31.54 0v480.46A15.77 15.77 0 0015.77 512h480.46a15.77 15.77 0 000-31.54H434V289.12h46.45V407.4a15.78 15.78 0 0015.78 15.78zM289.8 480.46v-97.29h46.45v97.29z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/profits.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M196.19 116.46L319.57 83.4l-33.06 123.38-90.32-90.32z"></path><path class="lineal-stroke" d="M330.72 72.25a15.72 15.72 0 00-15.23-4.08L192.1 101.23a15.77 15.77 0 00-7.1 26.38l12.05 12-80.6 80.59a15.79 15.79 0 000 22.31l43.93 43.93a15.8 15.8 0 0022.31 0L241.2 228a15.77 15.77 0 00-22.31-22.3L171.56 253l-21.62-21.6 69.44-69.4 56 56a15.77 15.77 0 0026.39-7.08L334.8 87.48a15.77 15.77 0 00-4.08-15.23zm-52.38 104.06l-51.69-51.69 70.61-18.92z"></path><path class="lineal-fill" d="M274.03 367.39h77.99v128.84h-77.99z"></path><path class="lineal-stroke" d="M496.23 423.18A15.78 15.78 0 00512 407.4v-134a15.77 15.77 0 00-15.77-15.77h-78a15.78 15.78 0 00-15.78 15.77v207.06H367.8V367.39a15.77 15.77 0 00-15.8-15.77h-78a15.77 15.77 0 00-15.77 15.77v113.07H145.6v-32.88h62.22a15.77 15.77 0 100-31.54h-78a15.77 15.77 0 00-15.77 15.77v48.65H31.54V15.77a15.77 15.77 0 00-31.54 0v480.46A15.77 15.77 0 0015.77 512h480.46a15.77 15.77 0 000-31.54H434V289.12h46.45V407.4a15.78 15.78 0 0015.78 15.78zM289.8 480.46v-97.29h46.45v97.29z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">profits</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/profits.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/profits.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 346.9 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/puzzle.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M130.2 398.9c23-1.6 40.3-21.6 38.7-44.6-.7-9.2-4.3-17.9-10.4-24.8-4.8-5.5-7.6-12.4-8.1-19.6H104c-.5 7.3-3.3 14.3-8.1 19.8-15.2 17.4-13.4 43.7 3.9 58.9 8.4 7.4 19.3 11.1 30.4 10.3zm-5.9-388.2c-23 1.6-40.3 21.6-38.7 44.6.7 9.2 4.4 17.9 10.5 24.7 4.8 5.5 7.6 12.4 8 19.6h46.4c.5-7.3 3.3-14.3 8.1-19.8 15.2-17.4 13.4-43.8-4-58.9-8.3-7.3-19.2-11-30.3-10.2z"></path><path class="lineal-stroke" d="M346.7 201.1c-1.7-25-21.8-45.8-46.7-48.3-14.6-1.6-29.3 3.1-40.3 12.9-1.6 1.4-3.4 2.5-5.3 3.4v-52c0-15.5-12.5-28-28-28h-61.6c.5-.8 1.1-1.6 1.7-2.3 8.4-9.5 13-21.8 13-34.5 0-28.9-23.4-52.3-52.3-52.3-1.2 0-2.5 0-3.7.1-25 1.7-45.8 21.8-48.3 46.7-1.6 14.6 3.1 29.3 12.9 40.3.6.7 1.1 1.3 1.6 2H28c-15.5 0-28 12.5-28 28v58.3c0 2.2.7 4.4 2 6.2 3.4 4.7 10 5.7 14.8 2.3 1.1-.8 2.1-1.6 3-2.5 11.8-10.4 29.4-10.5 41.3-.1 13 11.4 14.3 31.1 2.9 44-11.4 13-31.1 14.3-44 2.9-1.1-.9-2.2-1.8-3.3-2.6-1.8-1.3-3.9-2-6.1-2-5.8 0-10.6 4.7-10.6 10.5v58.3c0 15.5 12.5 28 28 28h61.7c-.5.8-1.1 1.6-1.7 2.3-8.4 9.5-13 21.8-13 34.5 0 28.9 23.4 52.3 52.3 52.3 1.2 0 2.5 0 3.7-.1 25-1.7 45.7-21.8 48.3-46.7 1.6-14.6-3.1-29.3-12.9-40.3-.6-.6-1.1-1.3-1.6-2h61.7c15.5 0 28-12.5 28-28V191.2c7.1-1.6 13.7-4.9 19.3-9.8 6.6-5.9 15.3-8.7 24.1-7.7 15 1.7 26.6 13.8 27.8 28.8.1.8.1 1.5.1 2.3 0 17.2-14 31.2-31.2 31.2-2.5 0-5-.3-7.5-.9-5.5-1.2-10.9 2.1-12.4 7.5-1.5 5.6 1.8 11.4 7.4 13 4.1 1 8.3 1.5 12.5 1.5 14.5 0 28.3-6 38.2-16.6 10-10.6 15-24.9 13.9-39.4zM96.3 49C98 34 110 22.4 125 21.2c.8-.1 1.5-.1 2.2-.1 7.6 0 14.9 2.7 20.5 7.7 13 11.3 14.3 31 2.9 44-4.1 4.7-7.2 10.2-9 16.2h-28.9c-1.8-5.9-4.8-11.4-8.9-16.1-5.7-6.4-8.5-15.2-7.5-23.9zm62 311.7c-1.7 15-13.8 26.6-28.8 27.7-.7.1-1.5.1-2.2.1-7.6 0-14.9-2.7-20.5-7.7-13-11.3-14.3-31-2.9-44 4.1-4.7 7.2-10.2 9-16.2h28.9c1.8 5.9 4.8 11.4 8.9 16.1 5.8 6.5 8.6 15.2 7.6 24zm75.1-68.2c0 3.8-3.1 6.9-6.9 6.9H28c-3.8 0-6.9-3.1-6.9-6.9v-39.1c20 8 43 2.9 57.7-12.9 10-10.6 15-24.9 13.9-39.4-1.8-25-21.8-45.8-46.7-48.3-8.5-.9-17.1.3-25 3.5v-39.1c0-3.8 3.1-6.9 6.9-6.9h198.6c3.8 0 6.9 3.1 6.9 6.9v175.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 346.9 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/puzzle.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M130.2 398.9c23-1.6 40.3-21.6 38.7-44.6-.7-9.2-4.3-17.9-10.4-24.8-4.8-5.5-7.6-12.4-8.1-19.6H104c-.5 7.3-3.3 14.3-8.1 19.8-15.2 17.4-13.4 43.7 3.9 58.9 8.4 7.4 19.3 11.1 30.4 10.3zm-5.9-388.2c-23 1.6-40.3 21.6-38.7 44.6.7 9.2 4.4 17.9 10.5 24.7 4.8 5.5 7.6 12.4 8 19.6h46.4c.5-7.3 3.3-14.3 8.1-19.8 15.2-17.4 13.4-43.8-4-58.9-8.3-7.3-19.2-11-30.3-10.2z"></path><path class="lineal-stroke" d="M346.7 201.1c-1.7-25-21.8-45.8-46.7-48.3-14.6-1.6-29.3 3.1-40.3 12.9-1.6 1.4-3.4 2.5-5.3 3.4v-52c0-15.5-12.5-28-28-28h-61.6c.5-.8 1.1-1.6 1.7-2.3 8.4-9.5 13-21.8 13-34.5 0-28.9-23.4-52.3-52.3-52.3-1.2 0-2.5 0-3.7.1-25 1.7-45.8 21.8-48.3 46.7-1.6 14.6 3.1 29.3 12.9 40.3.6.7 1.1 1.3 1.6 2H28c-15.5 0-28 12.5-28 28v58.3c0 2.2.7 4.4 2 6.2 3.4 4.7 10 5.7 14.8 2.3 1.1-.8 2.1-1.6 3-2.5 11.8-10.4 29.4-10.5 41.3-.1 13 11.4 14.3 31.1 2.9 44-11.4 13-31.1 14.3-44 2.9-1.1-.9-2.2-1.8-3.3-2.6-1.8-1.3-3.9-2-6.1-2-5.8 0-10.6 4.7-10.6 10.5v58.3c0 15.5 12.5 28 28 28h61.7c-.5.8-1.1 1.6-1.7 2.3-8.4 9.5-13 21.8-13 34.5 0 28.9 23.4 52.3 52.3 52.3 1.2 0 2.5 0 3.7-.1 25-1.7 45.7-21.8 48.3-46.7 1.6-14.6-3.1-29.3-12.9-40.3-.6-.6-1.1-1.3-1.6-2h61.7c15.5 0 28-12.5 28-28V191.2c7.1-1.6 13.7-4.9 19.3-9.8 6.6-5.9 15.3-8.7 24.1-7.7 15 1.7 26.6 13.8 27.8 28.8.1.8.1 1.5.1 2.3 0 17.2-14 31.2-31.2 31.2-2.5 0-5-.3-7.5-.9-5.5-1.2-10.9 2.1-12.4 7.5-1.5 5.6 1.8 11.4 7.4 13 4.1 1 8.3 1.5 12.5 1.5 14.5 0 28.3-6 38.2-16.6 10-10.6 15-24.9 13.9-39.4zM96.3 49C98 34 110 22.4 125 21.2c.8-.1 1.5-.1 2.2-.1 7.6 0 14.9 2.7 20.5 7.7 13 11.3 14.3 31 2.9 44-4.1 4.7-7.2 10.2-9 16.2h-28.9c-1.8-5.9-4.8-11.4-8.9-16.1-5.7-6.4-8.5-15.2-7.5-23.9zm62 311.7c-1.7 15-13.8 26.6-28.8 27.7-.7.1-1.5.1-2.2.1-7.6 0-14.9-2.7-20.5-7.7-13-11.3-14.3-31-2.9-44 4.1-4.7 7.2-10.2 9-16.2h28.9c1.8 5.9 4.8 11.4 8.9 16.1 5.8 6.5 8.6 15.2 7.6 24zm75.1-68.2c0 3.8-3.1 6.9-6.9 6.9H28c-3.8 0-6.9-3.1-6.9-6.9v-39.1c20 8 43 2.9 57.7-12.9 10-10.6 15-24.9 13.9-39.4-1.8-25-21.8-45.8-46.7-48.3-8.5-.9-17.1.3-25 3.5v-39.1c0-3.8 3.1-6.9 6.9-6.9h198.6c3.8 0 6.9 3.1 6.9 6.9v175.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">puzzle</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/puzzle.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/puzzle.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/puzzle-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M257.9 15.2v65.1c-28.7-15.6-64.7-5-80.3 23.8s-5 64.7 23.8 80.3c17.6 9.6 38.9 9.6 56.6 0v65.1h59.9c-8.4-31.6 10.5-64 42.1-72.4 31.6-8.4 64 10.5 72.4 42.1 2.6 9.9 2.6 20.4 0 30.3h59.9V70.7c0-30.7-24.9-55.5-55.5-55.5H257.9z"></path><path class="lineal-stroke" d="M436.7 0h-366C31.7 0 0 31.7 0 70.7v370.6c0 39 31.7 70.7 70.7 70.7h188.1c8.4 0 15.2-6.8 15.2-15.1V453c5.5 1 11.2 1.3 16.8 1 17.5-.9 34.2-7.9 47.1-19.9 30.1-28 31.7-75.1 3.7-105.2-23.2-24.8-60.2-30.8-90-14.6-7.3 4-10.1 13.2-6.1 20.6 4 7.4 13.2 10.1 20.6 6.1 7.4-4 15.7-5.8 24.1-5.2 24.3 1.7 42.6 22.8 40.9 47-1.5 21.8-19.8 39.8-41.7 40.8-8.1.4-16.1-1.4-23.2-5.3-2.2-1.2-4.7-1.8-7.3-1.8-8.4 0-15.2 6.8-15.2 15.2v49.9h-173c-22.3 0-40.3-18.1-40.3-40.3V264.6h28.7c-.5 2.6-.8 5.2-1 7.8-2.9 41 28 76.6 69 79.5 1.8.1 3.6.2 5.3.2 18.8.1 37-7.1 50.7-20 24.8-23.2 30.8-60.1 14.6-89.9-.1-.2-.2-.3-.3-.5-4.1-7.3-13.4-9.9-20.7-5.7-7.3 4.1-9.9 13.4-5.7 20.7 4 7.4 5.8 15.8 5.2 24.2-1.7 24.3-22.8 42.5-47.1 40.8-21.8-1.5-39.8-19.8-40.8-41.7-.4-8.1 1.4-16.1 5.2-23.3 1.2-2.2 1.9-4.7 1.9-7.3 0-8.4-6.8-15.2-15.2-15.2H30.4V70.7c0-22.3 18.1-40.3 40.3-40.3h172v28.7c-8.7-1.6-17.6-1.6-26.2 0-40.5 7.2-67.4 45.9-60.1 86.4s45.9 67.4 86.4 60.1v43.9c0 8.4 6.8 15.2 15.2 15.2h59.9c1.6 0 3.2-.3 4.7-.7 8-2.6 12.3-11.2 9.7-19.2-.6-2.5-1-5.1-1.2-7.7-1.5-24.3 16.9-45.2 41.2-46.7.9-.1 1.8-.1 2.7-.1 3.8 0 7.6.5 11.3 1.5 23.5 6.2 37.5 30.4 31.3 53.9-.3 1.3-.5 2.6-.5 3.9 0 8.4 6.8 15.2 15.2 15.2h59.9c8.4 0 15.2-6.8 15.2-15.2V70.7c-.1-39-31.7-70.7-70.7-70.7zM477 234.2h-27.5c0-41.1-33.3-74.4-74.4-74.4-1.5 0-3 0-4.6.1-36 2.2-65.9 30.9-69.5 66.8-.2 2.5-.4 5-.4 7.5h-27.5v-49.9c0-2.5-.6-5-1.8-7.3-4-7.4-13.2-10.1-20.6-6.1-7.4 4-15.7 5.8-24.1 5.2-24.3-1.7-42.6-22.8-40.9-47 1.5-21.8 19.8-39.8 41.7-40.8 8.1-.4 16.1 1.4 23.2 5.3 2.2 1.2 4.7 1.8 7.3 1.8 8.4 0 15.2-6.8 15.2-15.2V30.4h163.6c22.3 0 40.3 18.1 40.3 40.3v163.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/puzzle-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M257.9 15.2v65.1c-28.7-15.6-64.7-5-80.3 23.8s-5 64.7 23.8 80.3c17.6 9.6 38.9 9.6 56.6 0v65.1h59.9c-8.4-31.6 10.5-64 42.1-72.4 31.6-8.4 64 10.5 72.4 42.1 2.6 9.9 2.6 20.4 0 30.3h59.9V70.7c0-30.7-24.9-55.5-55.5-55.5H257.9z"></path><path class="lineal-stroke" d="M436.7 0h-366C31.7 0 0 31.7 0 70.7v370.6c0 39 31.7 70.7 70.7 70.7h188.1c8.4 0 15.2-6.8 15.2-15.1V453c5.5 1 11.2 1.3 16.8 1 17.5-.9 34.2-7.9 47.1-19.9 30.1-28 31.7-75.1 3.7-105.2-23.2-24.8-60.2-30.8-90-14.6-7.3 4-10.1 13.2-6.1 20.6 4 7.4 13.2 10.1 20.6 6.1 7.4-4 15.7-5.8 24.1-5.2 24.3 1.7 42.6 22.8 40.9 47-1.5 21.8-19.8 39.8-41.7 40.8-8.1.4-16.1-1.4-23.2-5.3-2.2-1.2-4.7-1.8-7.3-1.8-8.4 0-15.2 6.8-15.2 15.2v49.9h-173c-22.3 0-40.3-18.1-40.3-40.3V264.6h28.7c-.5 2.6-.8 5.2-1 7.8-2.9 41 28 76.6 69 79.5 1.8.1 3.6.2 5.3.2 18.8.1 37-7.1 50.7-20 24.8-23.2 30.8-60.1 14.6-89.9-.1-.2-.2-.3-.3-.5-4.1-7.3-13.4-9.9-20.7-5.7-7.3 4.1-9.9 13.4-5.7 20.7 4 7.4 5.8 15.8 5.2 24.2-1.7 24.3-22.8 42.5-47.1 40.8-21.8-1.5-39.8-19.8-40.8-41.7-.4-8.1 1.4-16.1 5.2-23.3 1.2-2.2 1.9-4.7 1.9-7.3 0-8.4-6.8-15.2-15.2-15.2H30.4V70.7c0-22.3 18.1-40.3 40.3-40.3h172v28.7c-8.7-1.6-17.6-1.6-26.2 0-40.5 7.2-67.4 45.9-60.1 86.4s45.9 67.4 86.4 60.1v43.9c0 8.4 6.8 15.2 15.2 15.2h59.9c1.6 0 3.2-.3 4.7-.7 8-2.6 12.3-11.2 9.7-19.2-.6-2.5-1-5.1-1.2-7.7-1.5-24.3 16.9-45.2 41.2-46.7.9-.1 1.8-.1 2.7-.1 3.8 0 7.6.5 11.3 1.5 23.5 6.2 37.5 30.4 31.3 53.9-.3 1.3-.5 2.6-.5 3.9 0 8.4 6.8 15.2 15.2 15.2h59.9c8.4 0 15.2-6.8 15.2-15.2V70.7c-.1-39-31.7-70.7-70.7-70.7zM477 234.2h-27.5c0-41.1-33.3-74.4-74.4-74.4-1.5 0-3 0-4.6.1-36 2.2-65.9 30.9-69.5 66.8-.2 2.5-.4 5-.4 7.5h-27.5v-49.9c0-2.5-.6-5-1.8-7.3-4-7.4-13.2-10.1-20.6-6.1-7.4 4-15.7 5.8-24.1 5.2-24.3-1.7-42.6-22.8-40.9-47 1.5-21.8 19.8-39.8 41.7-40.8 8.1-.4 16.1 1.4 23.2 5.3 2.2 1.2 4.7 1.8 7.3 1.8 8.4 0 15.2-6.8 15.2-15.2V30.4h163.6c22.3 0 40.3 18.1 40.3 40.3v163.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">puzzle-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/puzzle-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/puzzle-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 254.52" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/ranking.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M269.63 244.21H140V42.29a32 32 0 0132-32h65.7a32 32 0 0132 32v201.92z"></path><path class="lineal-stroke" d="M279.94 254.52H129.66V42.29A42.34 42.34 0 01172 0h65.7a42.34 42.34 0 0142.29 42.29zm-129.67-20.61h109.06V42.29a21.7 21.7 0 00-21.68-21.68H172a21.71 21.71 0 00-21.68 21.68z"></path><path class="lineal-stroke" d="M409.6 254.52H259.33V81.4h108a42.34 42.34 0 0142.29 42.29H389A21.7 21.7 0 00367.31 102h-87.37v131.9H389v-55.41h20.6zm-259.33 0H0V103.08A42.33 42.33 0 0142.29 60.8h108zM20.61 233.91h109.05V81.4H42.29a21.71 21.71 0 00-21.68 21.68zM230 136.48v16h-48.1v-16h15.81v-28.39a12.27 12.27 0 01-3.12 2.72 32.85 32.85 0 01-4.73 2.56 34.66 34.66 0 01-5.34 1.9 19.31 19.31 0 01-4.85.72V99.51a12.47 12.47 0 004.62-1.22 43.45 43.45 0 005.63-3 50.39 50.39 0 005-3.51 10.48 10.48 0 002.78-2.89h18.15v47.55z"></path><path class="lineal-stroke" d="M47.41 206.65a50.57 50.57 0 01.78-9.35 24.89 24.89 0 012.67-7.52 24.55 24.55 0 015.14-6.29 47.23 47.23 0 018.13-5.68q5.24-2.88 8.74-4.78a57.5 57.5 0 005.57-3.34 13.39 13.39 0 003-2.62 4.4 4.4 0 00.89-2.73 6.23 6.23 0 00-2.23-5 9.52 9.52 0 00-6.34-1.89 14.4 14.4 0 00-8.13 2.28 33.74 33.74 0 00-6.68 6l-11.43-13.19a21.94 21.94 0 014.79-3.9 41.74 41.74 0 016.79-3.39 47 47 0 018.3-2.4 48.77 48.77 0 019.41-.89q12 0 18.42 5.24t6.41 14.14a17.41 17.41 0 01-1.17 6.57 19.46 19.46 0 01-3.06 5.17 24.26 24.26 0 01-4.23 4q-2.34 1.72-4.79 3.18c-1.12.66-2.45 1.44-4 2.34s-3.1 1.8-4.62 2.72-2.94 1.86-4.23 2.78a19.4 19.4 0 00-3 2.51h30.29v16H47.41zm298.26-34.54a17.14 17.14 0 015.58 2.1 15.66 15.66 0 014.36 3.82 16.87 16.87 0 012.79 5.28 20.56 20.56 0 011 6.42 18.06 18.06 0 01-1.86 8.27 17.83 17.83 0 01-5.34 6.26 25.84 25.84 0 01-8.37 4 39.17 39.17 0 01-11 1.43q-14.88 0-23.3-8.72l8.47-11.15a17.75 17.75 0 006 4.16 20.69 20.69 0 008.07 1.42q11.07 0 11.06-8.12a7.54 7.54 0 00-3.28-6.66q-3.27-2.25-10.32-2.25h-2.94v-11.26h3.23q5.47 0 8.57-2.25a7 7 0 003.08-6 5.69 5.69 0 00-2.25-4.89 9.8 9.8 0 00-6-1.67 14.28 14.28 0 00-7.3 1.91 16.28 16.28 0 00-5.53 5.43l-9.88-11.35a17.9 17.9 0 014.11-3.82 26.35 26.35 0 015.77-3 39.16 39.16 0 017-1.91 41.65 41.65 0 017.63-.69 35 35 0 019.5 1.22 22.18 22.18 0 017.34 3.53 16.36 16.36 0 014.7 5.48 15.2 15.2 0 011.66 7.1 16.71 16.71 0 01-.93 5.58 17.11 17.11 0 01-2.59 4.8 14.87 14.87 0 01-4 3.57 14.43 14.43 0 01-5 1.91z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 254.52" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/ranking.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M269.63 244.21H140V42.29a32 32 0 0132-32h65.7a32 32 0 0132 32v201.92z"></path><path class="lineal-stroke" d="M279.94 254.52H129.66V42.29A42.34 42.34 0 01172 0h65.7a42.34 42.34 0 0142.29 42.29zm-129.67-20.61h109.06V42.29a21.7 21.7 0 00-21.68-21.68H172a21.71 21.71 0 00-21.68 21.68z"></path><path class="lineal-stroke" d="M409.6 254.52H259.33V81.4h108a42.34 42.34 0 0142.29 42.29H389A21.7 21.7 0 00367.31 102h-87.37v131.9H389v-55.41h20.6zm-259.33 0H0V103.08A42.33 42.33 0 0142.29 60.8h108zM20.61 233.91h109.05V81.4H42.29a21.71 21.71 0 00-21.68 21.68zM230 136.48v16h-48.1v-16h15.81v-28.39a12.27 12.27 0 01-3.12 2.72 32.85 32.85 0 01-4.73 2.56 34.66 34.66 0 01-5.34 1.9 19.31 19.31 0 01-4.85.72V99.51a12.47 12.47 0 004.62-1.22 43.45 43.45 0 005.63-3 50.39 50.39 0 005-3.51 10.48 10.48 0 002.78-2.89h18.15v47.55z"></path><path class="lineal-stroke" d="M47.41 206.65a50.57 50.57 0 01.78-9.35 24.89 24.89 0 012.67-7.52 24.55 24.55 0 015.14-6.29 47.23 47.23 0 018.13-5.68q5.24-2.88 8.74-4.78a57.5 57.5 0 005.57-3.34 13.39 13.39 0 003-2.62 4.4 4.4 0 00.89-2.73 6.23 6.23 0 00-2.23-5 9.52 9.52 0 00-6.34-1.89 14.4 14.4 0 00-8.13 2.28 33.74 33.74 0 00-6.68 6l-11.43-13.19a21.94 21.94 0 014.79-3.9 41.74 41.74 0 016.79-3.39 47 47 0 018.3-2.4 48.77 48.77 0 019.41-.89q12 0 18.42 5.24t6.41 14.14a17.41 17.41 0 01-1.17 6.57 19.46 19.46 0 01-3.06 5.17 24.26 24.26 0 01-4.23 4q-2.34 1.72-4.79 3.18c-1.12.66-2.45 1.44-4 2.34s-3.1 1.8-4.62 2.72-2.94 1.86-4.23 2.78a19.4 19.4 0 00-3 2.51h30.29v16H47.41zm298.26-34.54a17.14 17.14 0 015.58 2.1 15.66 15.66 0 014.36 3.82 16.87 16.87 0 012.79 5.28 20.56 20.56 0 011 6.42 18.06 18.06 0 01-1.86 8.27 17.83 17.83 0 01-5.34 6.26 25.84 25.84 0 01-8.37 4 39.17 39.17 0 01-11 1.43q-14.88 0-23.3-8.72l8.47-11.15a17.75 17.75 0 006 4.16 20.69 20.69 0 008.07 1.42q11.07 0 11.06-8.12a7.54 7.54 0 00-3.28-6.66q-3.27-2.25-10.32-2.25h-2.94v-11.26h3.23q5.47 0 8.57-2.25a7 7 0 003.08-6 5.69 5.69 0 00-2.25-4.89 9.8 9.8 0 00-6-1.67 14.28 14.28 0 00-7.3 1.91 16.28 16.28 0 00-5.53 5.43l-9.88-11.35a17.9 17.9 0 014.11-3.82 26.35 26.35 0 015.77-3 39.16 39.16 0 017-1.91 41.65 41.65 0 017.63-.69 35 35 0 019.5 1.22 22.18 22.18 0 017.34 3.53 16.36 16.36 0 014.7 5.48 15.2 15.2 0 011.66 7.1 16.71 16.71 0 01-.93 5.58 17.11 17.11 0 01-2.59 4.8 14.87 14.87 0 01-4 3.57 14.43 14.43 0 01-5 1.91z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">ranking</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/ranking.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/ranking.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 406.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/refresh.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M195.11 406.5A198 198 0 01.18 241.56a13.25 13.25 0 0110.58-15.2L66 215.81a13.25 13.25 0 015 26l-42 8A171.12 171.12 0 00329.34 315l.45-.56-21.22-21.22-.57.78a142.59 142.59 0 01-112.9 56.31 140.62 140.62 0 01-112-55.08 13.25 13.25 0 0121-16.21 114.29 114.29 0 0091 44.8A115.94 115.94 0 00286.9 278l9.74-12.83a13.26 13.26 0 0119.92-1.37l40.3 40.31a13.23 13.23 0 011 17.58l-7.76 9.81a197.44 197.44 0 01-155 75z"></path><path class="lineal-fill" d="M240.1 253.81L396.35 224 366.5 380.2z"></path><path class="lineal-stroke" d="M366.5 393.45a13.26 13.26 0 01-9.37-3.88l-126.4-126.4a13.25 13.25 0 016.89-22.38l156.24-29.85a13.25 13.25 0 0115.5 15.5l-29.85 156.25a13.23 13.23 0 01-9.12 10.17 13 13 0 01-3.89.59zm-99.34-131.33l91 91 21.5-112.52zm73.95-71.2a13.25 13.25 0 01-2.47-26.26l42-8A171.13 171.13 0 0080.25 91.47l-.44.56L101 113.25l.56-.74a142.59 142.59 0 01112.89-56.3 140.64 140.64 0 01112 55.08 13.25 13.25 0 01-21 16.21 114.31 114.31 0 00-91-44.8 116 116 0 00-91.79 45.83L113 141.36a13.27 13.27 0 01-20 1.37l-40.3-40.31a13.24 13.24 0 01-1-17.58L59.48 75a197.72 197.72 0 01349.93 89.91 13.24 13.24 0 01-10.57 15.2l-55.22 10.55a13.41 13.41 0 01-2.51.24z"></path><path class="lineal-fill" d="M169.5 152.69L13.25 182.54 43.1 26.29z"></path><path class="lineal-stroke" d="M13.25 195.79a13.24 13.24 0 01-13-15.73L30.09 23.81a13.24 13.24 0 0122.38-6.88l126.39 126.39A13.24 13.24 0 01172 165.7L15.73 195.56a13.87 13.87 0 01-2.48.23zM51.42 53.35l-21.5 112.52 112.52-21.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 406.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/refresh.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M195.11 406.5A198 198 0 01.18 241.56a13.25 13.25 0 0110.58-15.2L66 215.81a13.25 13.25 0 015 26l-42 8A171.12 171.12 0 00329.34 315l.45-.56-21.22-21.22-.57.78a142.59 142.59 0 01-112.9 56.31 140.62 140.62 0 01-112-55.08 13.25 13.25 0 0121-16.21 114.29 114.29 0 0091 44.8A115.94 115.94 0 00286.9 278l9.74-12.83a13.26 13.26 0 0119.92-1.37l40.3 40.31a13.23 13.23 0 011 17.58l-7.76 9.81a197.44 197.44 0 01-155 75z"></path><path class="lineal-fill" d="M240.1 253.81L396.35 224 366.5 380.2z"></path><path class="lineal-stroke" d="M366.5 393.45a13.26 13.26 0 01-9.37-3.88l-126.4-126.4a13.25 13.25 0 016.89-22.38l156.24-29.85a13.25 13.25 0 0115.5 15.5l-29.85 156.25a13.23 13.23 0 01-9.12 10.17 13 13 0 01-3.89.59zm-99.34-131.33l91 91 21.5-112.52zm73.95-71.2a13.25 13.25 0 01-2.47-26.26l42-8A171.13 171.13 0 0080.25 91.47l-.44.56L101 113.25l.56-.74a142.59 142.59 0 01112.89-56.3 140.64 140.64 0 01112 55.08 13.25 13.25 0 01-21 16.21 114.31 114.31 0 00-91-44.8 116 116 0 00-91.79 45.83L113 141.36a13.27 13.27 0 01-20 1.37l-40.3-40.31a13.24 13.24 0 01-1-17.58L59.48 75a197.72 197.72 0 01349.93 89.91 13.24 13.24 0 01-10.57 15.2l-55.22 10.55a13.41 13.41 0 01-2.51.24z"></path><path class="lineal-fill" d="M169.5 152.69L13.25 182.54 43.1 26.29z"></path><path class="lineal-stroke" d="M13.25 195.79a13.24 13.24 0 01-13-15.73L30.09 23.81a13.24 13.24 0 0122.38-6.88l126.39 126.39A13.24 13.24 0 01172 165.7L15.73 195.56a13.87 13.87 0 01-2.48.23zM51.42 53.35l-21.5 112.52 112.52-21.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">refresh</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/refresh.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/refresh.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 294.2 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/rocket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M31.2 342.9c-2.4 1.7-5.8 1.1-7.5-1.3-.6-.9-1-2-1-3.1v-77.1l68.9-77.2V150L5 247.1c-3.2 3.6-5 8.2-5 13v78.4c0 15.5 12.6 28.1 28.1 28.1 5.8 0 11.5-1.8 16.2-5.1l9.6-6.8-13.1-18.6-9.6 6.8zm258.1-95.8L200.7 148v34.2l70.8 79.3v77.1c0 3-2.4 5.4-5.4 5.4-1.1 0-2.2-.3-3.1-1l-9.6-6.7-13.1 18.6 9.6 6.7c12.7 8.9 30.3 5.9 39.2-6.9 3.3-4.7 5.1-10.4 5.1-16.1v-78.4c0-4.8-1.8-9.5-4.9-13.1zM147.1 409.6l-6.1-3.9c-2-1.3-49.3-32-49.3-72.5 0-40 23.3-72.6 53.1-74.2.8 0 1.6-.1 2.3-.1 4.1 0 8.1.6 12.1 1.7 9.1 2.7 17.6 8.4 24.6 16.6 11.9 14 18.7 34.4 18.7 55.9 0 40.5-47.2 71.2-49.3 72.5l-6.1 4zm0-127.9h-1c-17.5.9-31.7 24-31.7 51.5 0 19.6 19.9 39.1 32.6 48.9 12.7-9.8 32.6-29.3 32.6-48.9 0-16.2-4.9-31.2-13.3-41.1-4.1-4.8-8.8-8.1-13.6-9.5-1.8-.6-3.7-.9-5.6-.9z"></path><path class="lineal-fill" d="M147.1 11.4c-13.1 0-96.4 71.4-96.4 143.4 0 24.5 29.3 178.4 29.3 178.4h134.1s29.3-153.9 29.3-178.4c.1-72.4-83.9-143.4-96.3-143.4zm49.8 159.2c-1 4.9-2.7 9.6-5.1 14-.8 1.4-1.6 2.8-2.5 4.2-3.7 5.4-8.3 10.1-13.7 13.7-1.3.9-2.7 1.8-4.2 2.5-24.7 13.4-55.6 4.2-68.9-20.5s-4.2-55.6 20.5-68.9c7.4-4 15.8-6.2 24.3-6.1 3.4 0 6.9.3 10.2 1 4.9 1 9.6 2.7 14 5.1 7.2 3.9 13.4 9.5 17.9 16.3 5.7 8.4 8.7 18.3 8.7 28.4-.1 3.5-.4 6.9-1.2 10.3z"></path><path class="lineal-stroke" d="M147.1 222.6c-34.4 0-62.2-28-62.2-62.3 0-34.4 28-62.2 62.3-62.2 10.3 0 20.4 2.6 29.5 7.5 2.6 1.4 5.2 3.1 7.6 4.9 24.8 18.5 32.2 52.4 17.5 79.6-1 1.8-2 3.5-3.1 5.1-4.5 6.6-10.2 12.3-16.8 16.8-1.6 1.1-3.4 2.2-5.1 3.1-9.1 4.9-19.3 7.5-29.7 7.5zm0-101.7c-21.8-.3-39.7 17-40.1 38.8s17 39.7 38.8 40.1h1.3c2.7 0 5.4-.3 8-.8 3.8-.8 7.4-2.1 10.8-4 1.1-.6 2.2-1.3 3.2-2 4.2-2.8 7.8-6.5 10.7-10.7.7-1.1 1.4-2.1 2-3.3 1.9-3.4 3.2-7 4-10.8.5-2.6.8-5.3.8-8 0-12.5-5.9-24.2-15.9-31.6-1.5-1.1-3.1-2.2-4.8-3.1-3.4-1.9-7-3.2-10.8-4-2.6-.5-5.3-.8-8-.8v.2z"></path><path class="lineal-stroke" d="M89.5 321.8h115.2c9-47.9 27.4-149.1 27.4-167 0-63-69.5-123.9-85-131.5-6.7 3.3-26.8 18.4-46.8 43.2-24.6 30.4-38.2 61.8-38.2 88.4 0 17.9 18.4 119.1 27.4 166.9zm134.1 22.8H70.7l-1.8-9.3c-3-15.9-29.5-155.7-29.5-180.6 0-42.2 25-80.9 45.9-106C101.1 29.9 131.8 0 147.1 0c15 0 45.7 29.8 61.5 48.6 21.1 25.1 46.2 63.8 46.2 106.2 0 24.9-26.5 164.7-29.5 180.6l-1.7 9.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">rocket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/rocket.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/rocket.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 465.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/savings.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M156.8 465.5c-9.9 0-24.2-4.8-56.2-40.6-16.2-18.2-29.5-36-30.1-36.8-.4-.5-.7-1-1-1.6-6.1-11-9.3-23.3-9.3-35.8v-90.9c0-7.9 6.4-14.4 14.3-14.4h116c16.5 0 32.4 6.5 44.2 18.1l59.4 58.5c17.2 17.2 17.3 45.1.1 62.3s-45.1 17.3-62.3.1L172.7 325c-5.9 0-15.5-.1-23.1-.1l-10.8-.1c-7.9 0-14.3-6.5-14.3-14.4s6.5-14.3 14.4-14.3h.1l10.8.1c6.8 0 14.1.1 19.6.1h6.9c4.2 0 8.5.1 12.7 4.3l63.5 63.5c6 6 15.7 6 21.7 0s6-15.7 0-21.7L214.6 284c-6.4-6.3-15-9.9-24-9.8H88.9v76.5c0 7.4 1.8 14.6 5.2 21.1 2.6 3.5 13.6 17.9 26.5 32.4 25.5 28.8 35.2 32.2 36.5 32.6h155.1c10.6 0 22.9-5.5 34.6-11.2 9.9-4.8 83.3-54.6 127.3-84.9l.7-.5c8.2-5.1 10.7-15.8 5.6-23.9-4.9-7.9-15.2-10.5-23.3-6L350 381.4c-6.6 4.4-15.5 2.6-19.9-4-4.4-6.6-2.6-15.5 4-19.9l107.5-71.3c.2-.1.3-.2.5-.3 21.8-13.1 50.1-6 63.2 15.8 12.9 21.6 6.2 49.6-15.2 62.8-13.3 9.2-115.8 79.6-130.8 86.9-14.7 7.1-30.5 14.1-47.1 14.1H156.8z"></path><path class="lineal-fill" d="M14.4 242.2h84.2v189.6H14.4z"></path><path class="lineal-stroke" d="M98.5 446.1H14.4c-7.9 0-14.4-6.4-14.4-14.4V242.2c0-7.9 6.4-14.4 14.3-14.4h84.1c7.9 0 14.3 6.4 14.3 14.4v189.6c.1 7.9-6.3 14.3-14.2 14.3zm-69.8-28.7h55.4V256.5H28.7v160.9zM273 214.2c-59.2 0-107.1-48-107.1-107.1C165.9 47.9 213.9 0 273.1 0c59.1 0 107.1 48 107.1 107.1-.1 59.1-48.1 107.1-107.2 107.1zm0-185.5c-43.3 0-78.4 35.1-78.4 78.4s35.1 78.4 78.4 78.4c43.3 0 78.4-35.1 78.4-78.4-.1-43.3-35.1-78.3-78.4-78.4z"></path><circle class="lineal-fill" cx="348.9" cy="178.6" r="92.8"></circle><path class="lineal-stroke" d="M348.9 285.7c-59.1 0-107.1-47.9-107.1-107.1 0-59.1 47.9-107.1 107.1-107.1S456 119.4 456 178.6c-.1 59.1-48 107-107.1 107.1zm0-185.5c-43.3 0-78.4 35.1-78.4 78.4S305.7 257 349 257s78.4-35.1 78.4-78.4c-.1-43.3-35.2-78.4-78.5-78.4z"></path><path class="lineal-stroke" d="M345.4 224.9c-15.5-.5-28.2-8.5-28.2-16.8 0-4.4 3.9-10.9 8.8-10.9 5.4 0 9.8 7.6 19.4 9.3v-20.9c-11.9-4.5-25.9-10.1-25.9-26.6s12.1-24.3 25.9-26.2v-3.6c0-1.8 2.1-3.5 4.9-3.5 2.5 0 4.9 1.7 4.9 3.5v3.2c8 .3 23.1 2.3 23.1 11.2 0 3.5-2.3 10.6-8 10.6-4.3 0-6.7-4.1-15.1-4.8v18.9c11.8 4.4 25.5 10.5 25.5 27.9 0 16-10.4 25.7-25.5 28.2v3.8c0 1.8-2.5 3.5-4.9 3.5-2.9 0-4.9-1.7-4.9-3.5v-3.3zm1.3-59.7v-15.4c-5.8 1.2-8.3 4.1-8.3 7.2 0 3.8 3.4 6.1 8.3 8.2zm7.2 23.9v17.3c4.4-1 7.9-3.5 7.9-8.1 0-4.3-3.2-7-7.9-9.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 465.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/savings.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M156.8 465.5c-9.9 0-24.2-4.8-56.2-40.6-16.2-18.2-29.5-36-30.1-36.8-.4-.5-.7-1-1-1.6-6.1-11-9.3-23.3-9.3-35.8v-90.9c0-7.9 6.4-14.4 14.3-14.4h116c16.5 0 32.4 6.5 44.2 18.1l59.4 58.5c17.2 17.2 17.3 45.1.1 62.3s-45.1 17.3-62.3.1L172.7 325c-5.9 0-15.5-.1-23.1-.1l-10.8-.1c-7.9 0-14.3-6.5-14.3-14.4s6.5-14.3 14.4-14.3h.1l10.8.1c6.8 0 14.1.1 19.6.1h6.9c4.2 0 8.5.1 12.7 4.3l63.5 63.5c6 6 15.7 6 21.7 0s6-15.7 0-21.7L214.6 284c-6.4-6.3-15-9.9-24-9.8H88.9v76.5c0 7.4 1.8 14.6 5.2 21.1 2.6 3.5 13.6 17.9 26.5 32.4 25.5 28.8 35.2 32.2 36.5 32.6h155.1c10.6 0 22.9-5.5 34.6-11.2 9.9-4.8 83.3-54.6 127.3-84.9l.7-.5c8.2-5.1 10.7-15.8 5.6-23.9-4.9-7.9-15.2-10.5-23.3-6L350 381.4c-6.6 4.4-15.5 2.6-19.9-4-4.4-6.6-2.6-15.5 4-19.9l107.5-71.3c.2-.1.3-.2.5-.3 21.8-13.1 50.1-6 63.2 15.8 12.9 21.6 6.2 49.6-15.2 62.8-13.3 9.2-115.8 79.6-130.8 86.9-14.7 7.1-30.5 14.1-47.1 14.1H156.8z"></path><path class="lineal-fill" d="M14.4 242.2h84.2v189.6H14.4z"></path><path class="lineal-stroke" d="M98.5 446.1H14.4c-7.9 0-14.4-6.4-14.4-14.4V242.2c0-7.9 6.4-14.4 14.3-14.4h84.1c7.9 0 14.3 6.4 14.3 14.4v189.6c.1 7.9-6.3 14.3-14.2 14.3zm-69.8-28.7h55.4V256.5H28.7v160.9zM273 214.2c-59.2 0-107.1-48-107.1-107.1C165.9 47.9 213.9 0 273.1 0c59.1 0 107.1 48 107.1 107.1-.1 59.1-48.1 107.1-107.2 107.1zm0-185.5c-43.3 0-78.4 35.1-78.4 78.4s35.1 78.4 78.4 78.4c43.3 0 78.4-35.1 78.4-78.4-.1-43.3-35.1-78.3-78.4-78.4z"></path><circle class="lineal-fill" cx="348.9" cy="178.6" r="92.8"></circle><path class="lineal-stroke" d="M348.9 285.7c-59.1 0-107.1-47.9-107.1-107.1 0-59.1 47.9-107.1 107.1-107.1S456 119.4 456 178.6c-.1 59.1-48 107-107.1 107.1zm0-185.5c-43.3 0-78.4 35.1-78.4 78.4S305.7 257 349 257s78.4-35.1 78.4-78.4c-.1-43.3-35.2-78.4-78.5-78.4z"></path><path class="lineal-stroke" d="M345.4 224.9c-15.5-.5-28.2-8.5-28.2-16.8 0-4.4 3.9-10.9 8.8-10.9 5.4 0 9.8 7.6 19.4 9.3v-20.9c-11.9-4.5-25.9-10.1-25.9-26.6s12.1-24.3 25.9-26.2v-3.6c0-1.8 2.1-3.5 4.9-3.5 2.5 0 4.9 1.7 4.9 3.5v3.2c8 .3 23.1 2.3 23.1 11.2 0 3.5-2.3 10.6-8 10.6-4.3 0-6.7-4.1-15.1-4.8v18.9c11.8 4.4 25.5 10.5 25.5 27.9 0 16-10.4 25.7-25.5 28.2v3.8c0 1.8-2.5 3.5-4.9 3.5-2.9 0-4.9-1.7-4.9-3.5v-3.3zm1.3-59.7v-15.4c-5.8 1.2-8.3 4.1-8.3 7.2 0 3.8 3.4 6.1 8.3 8.2zm7.2 23.9v17.3c4.4-1 7.9-3.5 7.9-8.1 0-4.3-3.2-7-7.9-9.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">savings</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/savings.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/savings.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 506.5 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/scale.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M301.5 430.3h124.7V81.7h-346v348.6H215m4.3 0H100.7l96.1-171 104.7 171m17.4-186.4c-24.7 0-44.7-20-44.7-44.7s20-44.7 44.7-44.7c24.7 0 44.7 20 44.7 44.7 0 24.7-20 44.7-44.7 44.7z"></path><path class="lineal-stroke" d="M301.5 445.2c-.5 0-.9 0-1.4-.1-4.3-.4-8.3-2.7-10.8-6.2-.2-.3-.5-.7-.7-1.1l-91.3-149.1-71.2 126.6h93.1c8.2 0 14.9 6.7 14.9 14.9s-6.7 14.9-14.9 14.9H80.3c-8.2 0-14.9-6.7-14.9-14.9V81.7c0-8.2 6.7-14.9 14.9-14.9h346c8.2 0 14.9 6.7 14.9 14.9v348.6c0 8.2-6.7 14.9-14.9 14.9H301.5zm8.4-29.8h101.5V96.6H95.2v313.1L183.9 252c4-7.2 13.1-9.7 20.3-5.7 2.2 1.2 4.1 3 5.4 5.2l100.3 163.9zm9-156.6c-32.9 0-59.6-26.7-59.7-59.6 0-32.9 26.7-59.7 59.6-59.7s59.7 26.7 59.7 59.6c0 33-26.7 59.7-59.6 59.7zm0-89.4c-16.5 0-29.8 13.4-29.8 29.8s13.4 29.8 29.8 29.8c16.5 0 29.8-13.4 29.8-29.8 0-16.5-13.4-29.8-29.8-29.8zm172.7-69c-8.2 0-14.9-6.7-14.9-14.9V29.8H421c-8.2-.2-14.7-7.1-14.5-15.3C406.7 6.6 413.1.2 421 0h70.6c8.2 0 14.9 6.7 14.9 14.9v70.6c0 8.2-6.7 14.9-14.9 14.9zm-476.7 0C6.7 100.4 0 93.7 0 85.5V14.9C0 6.7 6.7 0 14.9 0h70.6c8.2.2 14.7 7.1 14.5 15.3-.2 7.9-6.6 14.3-14.5 14.5H29.8v55.7c0 8.2-6.7 14.9-14.9 14.9zM85.5 512H14.9C6.7 512 0 505.3 0 497.1v-70.6c.2-8.2 7.1-14.7 15.3-14.5 7.9.2 14.3 6.6 14.5 14.5v55.7h55.7c8.2.2 14.7 7.1 14.5 15.3-.2 7.9-6.6 14.3-14.5 14.5zm406.1 0H421c-8.2-.2-14.7-7.1-14.5-15.3.2-7.9 6.6-14.3 14.5-14.5h55.7v-55.7c0-8.2 6.7-14.9 14.9-14.9s14.9 6.7 14.9 14.9v70.6c0 8.2-6.7 14.9-14.9 14.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 506.5 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/scale.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M301.5 430.3h124.7V81.7h-346v348.6H215m4.3 0H100.7l96.1-171 104.7 171m17.4-186.4c-24.7 0-44.7-20-44.7-44.7s20-44.7 44.7-44.7c24.7 0 44.7 20 44.7 44.7 0 24.7-20 44.7-44.7 44.7z"></path><path class="lineal-stroke" d="M301.5 445.2c-.5 0-.9 0-1.4-.1-4.3-.4-8.3-2.7-10.8-6.2-.2-.3-.5-.7-.7-1.1l-91.3-149.1-71.2 126.6h93.1c8.2 0 14.9 6.7 14.9 14.9s-6.7 14.9-14.9 14.9H80.3c-8.2 0-14.9-6.7-14.9-14.9V81.7c0-8.2 6.7-14.9 14.9-14.9h346c8.2 0 14.9 6.7 14.9 14.9v348.6c0 8.2-6.7 14.9-14.9 14.9H301.5zm8.4-29.8h101.5V96.6H95.2v313.1L183.9 252c4-7.2 13.1-9.7 20.3-5.7 2.2 1.2 4.1 3 5.4 5.2l100.3 163.9zm9-156.6c-32.9 0-59.6-26.7-59.7-59.6 0-32.9 26.7-59.7 59.6-59.7s59.7 26.7 59.7 59.6c0 33-26.7 59.7-59.6 59.7zm0-89.4c-16.5 0-29.8 13.4-29.8 29.8s13.4 29.8 29.8 29.8c16.5 0 29.8-13.4 29.8-29.8 0-16.5-13.4-29.8-29.8-29.8zm172.7-69c-8.2 0-14.9-6.7-14.9-14.9V29.8H421c-8.2-.2-14.7-7.1-14.5-15.3C406.7 6.6 413.1.2 421 0h70.6c8.2 0 14.9 6.7 14.9 14.9v70.6c0 8.2-6.7 14.9-14.9 14.9zm-476.7 0C6.7 100.4 0 93.7 0 85.5V14.9C0 6.7 6.7 0 14.9 0h70.6c8.2.2 14.7 7.1 14.5 15.3-.2 7.9-6.6 14.3-14.5 14.5H29.8v55.7c0 8.2-6.7 14.9-14.9 14.9zM85.5 512H14.9C6.7 512 0 505.3 0 497.1v-70.6c.2-8.2 7.1-14.7 15.3-14.5 7.9.2 14.3 6.6 14.5 14.5v55.7h55.7c8.2.2 14.7 7.1 14.5 15.3-.2 7.9-6.6 14.3-14.5 14.5zm406.1 0H421c-8.2-.2-14.7-7.1-14.5-15.3.2-7.9 6.6-14.3 14.5-14.5h55.7v-55.7c0-8.2 6.7-14.9 14.9-14.9s14.9 6.7 14.9 14.9v70.6c0 8.2-6.7 14.9-14.9 14.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">scale</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/scale.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/scale.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 388.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/scroll.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M63.13 413.96h216.63v83.52H63.13z"></path><path class="lineal-stroke" d="M279.75 512H63.13a14.52 14.52 0 01-14.52-14.52V414a14.52 14.52 0 0114.52-14.52h216.62A14.52 14.52 0 01294.27 414v83.51A14.52 14.52 0 01279.75 512zM77.64 483h187.59v-54.52H77.64zM52.8 364.76A14.53 14.53 0 0139 354.64L2.13 239a44.84 44.84 0 0185.43-27.3L102 256.59a14.52 14.52 0 11-27.64 8.88l-14.45-44.92a15.81 15.81 0 10-30.12 9.61l36.84 115.67a14.51 14.51 0 01-9.42 18.24 14.7 14.7 0 01-4.41.69zM267 168.7h-43V44.84a44.84 44.84 0 00-88-12.22A44.83 44.83 0 0073.65 73.9v80.67a14.52 14.52 0 1029 0V73.9a15.81 15.81 0 0131.62 0v112.63a14.52 14.52 0 0029 0V44.84a15.81 15.81 0 0131.62 0v138.38a14.52 14.52 0 0014.51 14.52H267a16.6 16.6 0 0116.59 16.58v135.91a14.52 14.52 0 1029 0V214.32A45.67 45.67 0 00267 168.7zm45.19-81.77a14.52 14.52 0 01-12.07-22.57l30.74-46.14a14.51 14.51 0 0112.08-6.47A14.52 14.52 0 01355 18.22l30.73 46.14a14.52 14.52 0 11-24.16 16.1l-18.65-28-18.66 28a14.51 14.51 0 01-12.07 6.47zm30.75 103.29a14.5 14.5 0 01-12.08-6.46l-30.74-46.14a14.52 14.52 0 0124.17-16.1l18.65 28 18.66-28a14.52 14.52 0 0124.16 16.1L355 183.76a14.51 14.51 0 01-12.06 6.46z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 388.2 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/scroll.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M63.13 413.96h216.63v83.52H63.13z"></path><path class="lineal-stroke" d="M279.75 512H63.13a14.52 14.52 0 01-14.52-14.52V414a14.52 14.52 0 0114.52-14.52h216.62A14.52 14.52 0 01294.27 414v83.51A14.52 14.52 0 01279.75 512zM77.64 483h187.59v-54.52H77.64zM52.8 364.76A14.53 14.53 0 0139 354.64L2.13 239a44.84 44.84 0 0185.43-27.3L102 256.59a14.52 14.52 0 11-27.64 8.88l-14.45-44.92a15.81 15.81 0 10-30.12 9.61l36.84 115.67a14.51 14.51 0 01-9.42 18.24 14.7 14.7 0 01-4.41.69zM267 168.7h-43V44.84a44.84 44.84 0 00-88-12.22A44.83 44.83 0 0073.65 73.9v80.67a14.52 14.52 0 1029 0V73.9a15.81 15.81 0 0131.62 0v112.63a14.52 14.52 0 0029 0V44.84a15.81 15.81 0 0131.62 0v138.38a14.52 14.52 0 0014.51 14.52H267a16.6 16.6 0 0116.59 16.58v135.91a14.52 14.52 0 1029 0V214.32A45.67 45.67 0 00267 168.7zm45.19-81.77a14.52 14.52 0 01-12.07-22.57l30.74-46.14a14.51 14.51 0 0112.08-6.47A14.52 14.52 0 01355 18.22l30.73 46.14a14.52 14.52 0 11-24.16 16.1l-18.65-28-18.66 28a14.51 14.51 0 01-12.07 6.47zm30.75 103.29a14.5 14.5 0 01-12.08-6.46l-30.74-46.14a14.52 14.52 0 0124.17-16.1l18.65 28 18.66-28a14.52 14.52 0 0124.16 16.1L355 183.76a14.51 14.51 0 01-12.06 6.46z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">scroll</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/scroll.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/scroll.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 432.17 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/scroll-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M63.13 413.96h216.63v83.52H63.13z"></path><path class="lineal-stroke" d="M279.75 512H63.13a14.52 14.52 0 01-14.52-14.52V414a14.52 14.52 0 0114.52-14.52h216.62A14.52 14.52 0 01294.27 414v83.51A14.52 14.52 0 01279.75 512zm-202.1-29h187.59v-54.52H77.65zM52.8 364.76A14.53 14.53 0 0139 354.64L2.13 239a44.84 44.84 0 0185.43-27.3L102 256.59a14.52 14.52 0 11-27.64 8.88l-14.45-44.92a15.81 15.81 0 10-30.12 9.61l36.85 115.67a14.53 14.53 0 01-9.43 18.24 14.7 14.7 0 01-4.41.69zM267 168.7h-43V44.84a44.84 44.84 0 00-88-12.22 44.44 44.44 0 00-17.51-3.57A44.9 44.9 0 0073.65 73.9v80.67a14.52 14.52 0 0029 0V73.9a15.81 15.81 0 1131.61 0v112.63a14.52 14.52 0 0029 0V44.84a15.81 15.81 0 0131.62 0v138.38a14.52 14.52 0 0014.52 14.52H267a16.6 16.6 0 0116.59 16.58v135.91a14.52 14.52 0 1029 0V214.32A45.67 45.67 0 00267 168.7zm104.54-22.46a14.52 14.52 0 01-8.07-26.6l28-18.65-28-18.66a14.52 14.52 0 0116.1-24.16l46.13 30.74a14.51 14.51 0 010 24.16l-46.13 30.74a14.41 14.41 0 01-8.03 2.43z"></path><path class="lineal-stroke" d="M314.34 146.24a14.41 14.41 0 01-8-2.43l-46.14-30.74a14.51 14.51 0 010-24.16l46.14-30.74a14.52 14.52 0 0116.06 24.17l-28 18.66 28 18.66a14.51 14.51 0 01-8.06 26.59z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 432.17 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/scroll-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M63.13 413.96h216.63v83.52H63.13z"></path><path class="lineal-stroke" d="M279.75 512H63.13a14.52 14.52 0 01-14.52-14.52V414a14.52 14.52 0 0114.52-14.52h216.62A14.52 14.52 0 01294.27 414v83.51A14.52 14.52 0 01279.75 512zm-202.1-29h187.59v-54.52H77.65zM52.8 364.76A14.53 14.53 0 0139 354.64L2.13 239a44.84 44.84 0 0185.43-27.3L102 256.59a14.52 14.52 0 11-27.64 8.88l-14.45-44.92a15.81 15.81 0 10-30.12 9.61l36.85 115.67a14.53 14.53 0 01-9.43 18.24 14.7 14.7 0 01-4.41.69zM267 168.7h-43V44.84a44.84 44.84 0 00-88-12.22 44.44 44.44 0 00-17.51-3.57A44.9 44.9 0 0073.65 73.9v80.67a14.52 14.52 0 0029 0V73.9a15.81 15.81 0 1131.61 0v112.63a14.52 14.52 0 0029 0V44.84a15.81 15.81 0 0131.62 0v138.38a14.52 14.52 0 0014.52 14.52H267a16.6 16.6 0 0116.59 16.58v135.91a14.52 14.52 0 1029 0V214.32A45.67 45.67 0 00267 168.7zm104.54-22.46a14.52 14.52 0 01-8.07-26.6l28-18.65-28-18.66a14.52 14.52 0 0116.1-24.16l46.13 30.74a14.51 14.51 0 010 24.16l-46.13 30.74a14.41 14.41 0 01-8.03 2.43z"></path><path class="lineal-stroke" d="M314.34 146.24a14.41 14.41 0 01-8-2.43l-46.14-30.74a14.51 14.51 0 010-24.16l46.14-30.74a14.52 14.52 0 0116.06 24.17l-28 18.66 28 18.66a14.51 14.51 0 01-8.06 26.59z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">scroll-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/scroll-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/scroll-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/search.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M233 278.9c-46.6-46.5-46.6-122 0-168.6s122-46.6 168.6 0 46.6 122 0 168.6c-46.6 46.5-122 46.5-168.6 0z"></path><path class="lineal-stroke" d="M317.3 328.5c-73.8-.1-133.6-60-133.6-133.8.1-73.8 60-133.6 133.8-133.6s133.6 60 133.6 133.8c0 35.4-14.1 69.4-39.2 94.4-25 25.2-59.1 39.3-94.6 39.2zm0-238.3C259.6 90.3 213 137 213 194.7S259.8 299 317.5 298.9 421.8 252 421.7 194.4c0-27.6-11-54.1-30.6-73.7-19.5-19.6-46.1-30.6-73.8-30.5z"></path><path class="lineal-stroke" d="M144.1 258.9c1.4.1 2.8-.1 4.1-.5 7.8-2.2 12.3-10.4 10.1-18.1-16.5-57.8-.4-120 42.1-162.5 64.5-64.5 169.4-64.5 233.9 0 5.7 5.7 15 5.7 20.8 0s5.7-15 0-20.8c-76-76-199.5-76-275.5 0-50 50.1-68.9 123.2-49.5 191.3 1.7 6.3 7.5 10.6 14 10.6zM504.5 141c-2.2-7.8-10.4-12.3-18.2-10.1s-12.3 10.4-10.1 18.2c16.5 57.8.4 120-42.1 162.5-64.5 64.5-169.4 64.5-233.9 0-5.3-5.1-13.4-5.4-19.1-1-1 .6-1.9 1.3-2.8 2.2l-26.9 26.9-11.3-11.3c-5.7-5.7-15-5.7-20.8 0L4.3 443.5c-5.7 5.7-5.7 15 0 20.8l43.3 43.3c2.8 2.8 6.5 4.3 10.4 4.3 3.9 0 7.6-1.5 10.4-4.3l115.2-115.2c5.7-5.7 5.7-15 0-20.8l-11.3-11.3 18-18c35.2 30.3 80.2 47 126.9 46.9h2.3C427 388.1 513.2 300 512 192.6c-.2-17.5-2.7-34.8-7.5-51.6zM58 476.5L35.4 454l94.4-94.4 22.6 22.6L58 476.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/search.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M233 278.9c-46.6-46.5-46.6-122 0-168.6s122-46.6 168.6 0 46.6 122 0 168.6c-46.6 46.5-122 46.5-168.6 0z"></path><path class="lineal-stroke" d="M317.3 328.5c-73.8-.1-133.6-60-133.6-133.8.1-73.8 60-133.6 133.8-133.6s133.6 60 133.6 133.8c0 35.4-14.1 69.4-39.2 94.4-25 25.2-59.1 39.3-94.6 39.2zm0-238.3C259.6 90.3 213 137 213 194.7S259.8 299 317.5 298.9 421.8 252 421.7 194.4c0-27.6-11-54.1-30.6-73.7-19.5-19.6-46.1-30.6-73.8-30.5z"></path><path class="lineal-stroke" d="M144.1 258.9c1.4.1 2.8-.1 4.1-.5 7.8-2.2 12.3-10.4 10.1-18.1-16.5-57.8-.4-120 42.1-162.5 64.5-64.5 169.4-64.5 233.9 0 5.7 5.7 15 5.7 20.8 0s5.7-15 0-20.8c-76-76-199.5-76-275.5 0-50 50.1-68.9 123.2-49.5 191.3 1.7 6.3 7.5 10.6 14 10.6zM504.5 141c-2.2-7.8-10.4-12.3-18.2-10.1s-12.3 10.4-10.1 18.2c16.5 57.8.4 120-42.1 162.5-64.5 64.5-169.4 64.5-233.9 0-5.3-5.1-13.4-5.4-19.1-1-1 .6-1.9 1.3-2.8 2.2l-26.9 26.9-11.3-11.3c-5.7-5.7-15-5.7-20.8 0L4.3 443.5c-5.7 5.7-5.7 15 0 20.8l43.3 43.3c2.8 2.8 6.5 4.3 10.4 4.3 3.9 0 7.6-1.5 10.4-4.3l115.2-115.2c5.7-5.7 5.7-15 0-20.8l-11.3-11.3 18-18c35.2 30.3 80.2 47 126.9 46.9h2.3C427 388.1 513.2 300 512 192.6c-.2-17.5-2.7-34.8-7.5-51.6zM58 476.5L35.4 454l94.4-94.4 22.6 22.6L58 476.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">search</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/search.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/search.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/search-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M297.3 429.9c-118.7 0-215-96.2-215-215 0-80.1 44.5-153.5 115.5-190.6 105.1-54.7 235.1-13.8 289.9 91.3 4 8 .8 17.7-7.1 21.7-7.8 3.9-17.3.9-21.5-6.8C412.5 41.2 302 6.4 212.7 52.9c-89.4 46.7-124 156.9-77.4 246.3s156.9 124 246.3 77.4c61.7-32.2 99.8-96.8 98-166.4-.2-8.9 6.9-16.3 15.8-16.4 8.9-.2 16.2 6.8 16.4 15.7 2.9 118.8-91.1 217.5-209.9 220.4-1.4-.1-3 0-4.6 0z"></path><circle class="lineal-fill" cx="297.1" cy="214.9" r="111.1"></circle><path class="lineal-stroke" d="M297.1 342.1c-70.3 0-127.2-57-127.2-127.2s57-127.2 127.2-127.2 127.2 57 127.2 127.2c-.1 70.2-57 127.1-127.2 127.2zm0-222.2c-52.5 0-95 42.5-95 95s42.5 95 95 95 95-42.5 95-95c-.1-52.5-42.6-95-95-95zm-240.6 392C25.3 511.9 0 486.6 0 455.4c0-17.6 8.2-34.2 22.2-44.9L88.3 360c6.4-4.9 15.5-4.3 21.2 1.4l41.1 41.1c5.7 5.7 6.3 14.8 1.4 21.2l-50.5 66.1c-9.9 12.9-24.9 21-41.2 22.1h-3.8zm40.1-117.7l-54.9 41.9c-10.7 8.1-12.9 23.3-4.8 34s23.3 12.9 34 4.8c1.8-1.4 3.4-3 4.8-4.8l42-54.9-21.1-21z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/search-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M297.3 429.9c-118.7 0-215-96.2-215-215 0-80.1 44.5-153.5 115.5-190.6 105.1-54.7 235.1-13.8 289.9 91.3 4 8 .8 17.7-7.1 21.7-7.8 3.9-17.3.9-21.5-6.8C412.5 41.2 302 6.4 212.7 52.9c-89.4 46.7-124 156.9-77.4 246.3s156.9 124 246.3 77.4c61.7-32.2 99.8-96.8 98-166.4-.2-8.9 6.9-16.3 15.8-16.4 8.9-.2 16.2 6.8 16.4 15.7 2.9 118.8-91.1 217.5-209.9 220.4-1.4-.1-3 0-4.6 0z"></path><circle class="lineal-fill" cx="297.1" cy="214.9" r="111.1"></circle><path class="lineal-stroke" d="M297.1 342.1c-70.3 0-127.2-57-127.2-127.2s57-127.2 127.2-127.2 127.2 57 127.2 127.2c-.1 70.2-57 127.1-127.2 127.2zm0-222.2c-52.5 0-95 42.5-95 95s42.5 95 95 95 95-42.5 95-95c-.1-52.5-42.6-95-95-95zm-240.6 392C25.3 511.9 0 486.6 0 455.4c0-17.6 8.2-34.2 22.2-44.9L88.3 360c6.4-4.9 15.5-4.3 21.2 1.4l41.1 41.1c5.7 5.7 6.3 14.8 1.4 21.2l-50.5 66.1c-9.9 12.9-24.9 21-41.2 22.1h-3.8zm40.1-117.7l-54.9 41.9c-10.7 8.1-12.9 23.3-4.8 34s23.3 12.9 34 4.8c1.8-1.4 3.4-3 4.8-4.8l42-54.9-21.1-21z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">search-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/search-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/search-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 405.62 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/server.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M366 14.7H39.61a13.83 13.83 0 00-13.84 13.83v100.52a13.84 13.84 0 0013.84 13.84h127.11l36.09 47.81 36.09-47.81H366a13.84 13.84 0 0013.83-13.84V28.53A13.84 13.84 0 00366 14.7z"></path><path class="lineal-stroke" d="M202.81 205.4a14.71 14.71 0 01-11.73-5.85l-31.68-42H39.61a28.56 28.56 0 01-28.53-28.53V28.53A28.56 28.56 0 0139.61 0H366a28.56 28.56 0 0128.53 28.53v100.52A28.56 28.56 0 01366 157.58H246.22l-31.68 42a14.71 14.71 0 01-11.73 5.82zM40.47 128.19h126.25a14.7 14.7 0 0111.73 5.81l24.36 32.28L227.17 134a14.7 14.7 0 0111.73-5.84h126.25V29.39H40.47z"></path><path class="lineal-fill" d="M14.69 324.42h376.23v87.27H14.69z"></path><path class="lineal-stroke" d="M390.92 426.39H14.7A14.7 14.7 0 010 411.69v-87.27a14.7 14.7 0 0114.7-14.69h376.22a14.7 14.7 0 0114.7 14.69v87.27a14.7 14.7 0 01-14.7 14.7zM29.39 397h346.84v-57.88H29.39V397z"></path><path class="lineal-stroke" d="M390.92 512a14.7 14.7 0 01-14.69-14.7v-72.57H29.39v57.88h267a14.7 14.7 0 010 29.39H14.7A14.7 14.7 0 010 497.3V410a14.7 14.7 0 0114.7-14.7h376.22a14.7 14.7 0 0114.7 14.7v87.3a14.7 14.7 0 01-14.7 14.7zm0-172.88H14.7A14.7 14.7 0 010 324.42v-87.26a14.7 14.7 0 0114.7-14.7h150.39a14.7 14.7 0 010 29.39H29.39v57.88h346.84v-57.88h-135.7a14.7 14.7 0 110-29.39h150.39a14.7 14.7 0 0114.7 14.7v87.26a14.7 14.7 0 01-14.7 14.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 405.62 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/server.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M366 14.7H39.61a13.83 13.83 0 00-13.84 13.83v100.52a13.84 13.84 0 0013.84 13.84h127.11l36.09 47.81 36.09-47.81H366a13.84 13.84 0 0013.83-13.84V28.53A13.84 13.84 0 00366 14.7z"></path><path class="lineal-stroke" d="M202.81 205.4a14.71 14.71 0 01-11.73-5.85l-31.68-42H39.61a28.56 28.56 0 01-28.53-28.53V28.53A28.56 28.56 0 0139.61 0H366a28.56 28.56 0 0128.53 28.53v100.52A28.56 28.56 0 01366 157.58H246.22l-31.68 42a14.71 14.71 0 01-11.73 5.82zM40.47 128.19h126.25a14.7 14.7 0 0111.73 5.81l24.36 32.28L227.17 134a14.7 14.7 0 0111.73-5.84h126.25V29.39H40.47z"></path><path class="lineal-fill" d="M14.69 324.42h376.23v87.27H14.69z"></path><path class="lineal-stroke" d="M390.92 426.39H14.7A14.7 14.7 0 010 411.69v-87.27a14.7 14.7 0 0114.7-14.69h376.22a14.7 14.7 0 0114.7 14.69v87.27a14.7 14.7 0 01-14.7 14.7zM29.39 397h346.84v-57.88H29.39V397z"></path><path class="lineal-stroke" d="M390.92 512a14.7 14.7 0 01-14.69-14.7v-72.57H29.39v57.88h267a14.7 14.7 0 010 29.39H14.7A14.7 14.7 0 010 497.3V410a14.7 14.7 0 0114.7-14.7h376.22a14.7 14.7 0 0114.7 14.7v87.3a14.7 14.7 0 01-14.7 14.7zm0-172.88H14.7A14.7 14.7 0 010 324.42v-87.26a14.7 14.7 0 0114.7-14.7h150.39a14.7 14.7 0 010 29.39H29.39v57.88h346.84v-57.88h-135.7a14.7 14.7 0 110-29.39h150.39a14.7 14.7 0 0114.7 14.7v87.26a14.7 14.7 0 01-14.7 14.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">server</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/server.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/server.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="256" cy="256" r="112.5"></circle><path class="lineal-stroke" d="M256 382.6c-69.9 0-126.6-56.7-126.6-126.6S186.1 129.4 256 129.4 382.6 186.1 382.6 256c-.1 69.9-56.7 126.5-126.6 126.6zm0-225.1c-54.4 0-98.5 44.1-98.5 98.5s44.1 98.5 98.5 98.5 98.5-44.1 98.5-98.5c-.1-54.4-44.1-98.4-98.5-98.5z"></path><path class="lineal-stroke" d="M279.4 512h-46.8c-16.2 0-29.4-13.2-29.4-29.4v-19.2c-19.9-5-38.9-12.9-56.5-23.4l-13.6 13.6c-5.5 5.5-14.4 5.5-19.9 0s-5.5-14.4 0-19.9l21.6-21.5c4.8-4.8 12.2-5.5 17.8-1.7 20.4 13.7 43.3 23.2 67.5 27.9 6.6 1.3 11.4 7.1 11.4 13.8v30.5c0 .7.6 1.3 1.3 1.3h46.8c.7 0 1.3-.6 1.3-1.3v-30.5c0-6.7 4.8-12.5 11.4-13.8 24.1-4.7 47.1-14.2 67.5-28 5.6-3.7 13-3 17.8 1.7l21.5 21.5c.5.5 1.3.5 1.8 0l33.1-33.1c.5-.5.5-1.3 0-1.8l-21.5-21.5c-4.8-4.8-5.5-12.2-1.7-17.8 13.8-20.4 23.3-43.3 28-67.5 1.3-6.6 7.1-11.4 13.8-11.4h30.5c.7 0 1.3-.6 1.3-1.3v-46.8c0-.7-.6-1.3-1.3-1.3h-30.5c-6.7 0-12.5-4.8-13.8-11.4-4.7-24.1-14.3-47.1-28-67.5-3.7-5.6-3-13 1.7-17.8l21.5-21.6c5.6-5.4 14.5-5.2 19.9.3 5.3 5.5 5.3 14.1 0 19.6l-13.9 14c10.5 17.6 18.4 36.7 23.4 56.6h19.2c16.2 0 29.3 13.2 29.4 29.4v46.8c0 16.2-13.2 29.4-29.4 29.4h-19.2c-5 19.9-12.9 38.9-23.4 56.5l13.6 13.6c11.5 11.5 11.5 30.1 0 41.6l-33.1 33.1c-11.5 11.5-30.1 11.5-41.6 0L365.3 440a211.57 211.57 0 01-56.5 23.4v19.2c-.1 16.3-13.2 29.4-29.4 29.4zm-211-109.1c-7.8 0-14.1-6.3-14-14.1 0-3.7 1.5-7.3 4.1-9.9L72 365.3a211.57 211.57 0 01-23.4-56.5H29.4C13.2 308.8 0 295.6 0 279.4v-46.8c0-16.2 13.2-29.4 29.4-29.4h19.2c5-19.9 12.9-38.9 23.4-56.5l-13.6-13.6C47 121.6 47 103 58.4 91.5l33.1-33.1c11.5-11.5 30.1-11.5 41.6 0L146.7 72c17.6-10.5 36.7-18.4 56.5-23.4V29.4c0-16.2 13.2-29.4 29.4-29.4h46.8c16.2 0 29.4 13.2 29.4 29.4v19.2c19.9 5 38.9 12.9 56.5 23.4l13.6-13.6c5.5-5.5 14.4-5.5 19.9 0s5.5 14.4 0 19.9l-21.5 21.6c-4.8 4.8-12.2 5.5-17.8 1.7-20.4-13.7-43.3-23.2-67.5-28-6.6-1.3-11.4-7.1-11.4-13.8V29.4c0-.7-.6-1.3-1.3-1.3h-46.8c-.7 0-1.3.6-1.3 1.3v30.5c0 6.7-4.8 12.5-11.4 13.8-24.1 4.7-47.1 14.2-67.5 28-5.6 3.8-13 3-17.8-1.7L113 78.4c-.5-.5-1.3-.5-1.8 0l-33.1 33.1c-.5.5-.5 1.3 0 1.8l21.6 21.6c4.8 4.8 5.5 12.2 1.7 17.8-13.8 20.4-23.3 43.3-28 67.5-1.3 6.6-7.1 11.4-13.8 11.4H29.4c-.7 0-1.3.6-1.3 1.3v46.8c0 .7.6 1.3 1.3 1.3h30.5c6.7 0 12.5 4.8 13.8 11.4 4.7 24.1 14.2 47.1 28 67.5 3.7 5.6 3 13-1.7 17.8l-21.6 21.5c-2.7 2.3-6.3 3.7-10 3.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="256" cy="256" r="112.5"></circle><path class="lineal-stroke" d="M256 382.6c-69.9 0-126.6-56.7-126.6-126.6S186.1 129.4 256 129.4 382.6 186.1 382.6 256c-.1 69.9-56.7 126.5-126.6 126.6zm0-225.1c-54.4 0-98.5 44.1-98.5 98.5s44.1 98.5 98.5 98.5 98.5-44.1 98.5-98.5c-.1-54.4-44.1-98.4-98.5-98.5z"></path><path class="lineal-stroke" d="M279.4 512h-46.8c-16.2 0-29.4-13.2-29.4-29.4v-19.2c-19.9-5-38.9-12.9-56.5-23.4l-13.6 13.6c-5.5 5.5-14.4 5.5-19.9 0s-5.5-14.4 0-19.9l21.6-21.5c4.8-4.8 12.2-5.5 17.8-1.7 20.4 13.7 43.3 23.2 67.5 27.9 6.6 1.3 11.4 7.1 11.4 13.8v30.5c0 .7.6 1.3 1.3 1.3h46.8c.7 0 1.3-.6 1.3-1.3v-30.5c0-6.7 4.8-12.5 11.4-13.8 24.1-4.7 47.1-14.2 67.5-28 5.6-3.7 13-3 17.8 1.7l21.5 21.5c.5.5 1.3.5 1.8 0l33.1-33.1c.5-.5.5-1.3 0-1.8l-21.5-21.5c-4.8-4.8-5.5-12.2-1.7-17.8 13.8-20.4 23.3-43.3 28-67.5 1.3-6.6 7.1-11.4 13.8-11.4h30.5c.7 0 1.3-.6 1.3-1.3v-46.8c0-.7-.6-1.3-1.3-1.3h-30.5c-6.7 0-12.5-4.8-13.8-11.4-4.7-24.1-14.3-47.1-28-67.5-3.7-5.6-3-13 1.7-17.8l21.5-21.6c5.6-5.4 14.5-5.2 19.9.3 5.3 5.5 5.3 14.1 0 19.6l-13.9 14c10.5 17.6 18.4 36.7 23.4 56.6h19.2c16.2 0 29.3 13.2 29.4 29.4v46.8c0 16.2-13.2 29.4-29.4 29.4h-19.2c-5 19.9-12.9 38.9-23.4 56.5l13.6 13.6c11.5 11.5 11.5 30.1 0 41.6l-33.1 33.1c-11.5 11.5-30.1 11.5-41.6 0L365.3 440a211.57 211.57 0 01-56.5 23.4v19.2c-.1 16.3-13.2 29.4-29.4 29.4zm-211-109.1c-7.8 0-14.1-6.3-14-14.1 0-3.7 1.5-7.3 4.1-9.9L72 365.3a211.57 211.57 0 01-23.4-56.5H29.4C13.2 308.8 0 295.6 0 279.4v-46.8c0-16.2 13.2-29.4 29.4-29.4h19.2c5-19.9 12.9-38.9 23.4-56.5l-13.6-13.6C47 121.6 47 103 58.4 91.5l33.1-33.1c11.5-11.5 30.1-11.5 41.6 0L146.7 72c17.6-10.5 36.7-18.4 56.5-23.4V29.4c0-16.2 13.2-29.4 29.4-29.4h46.8c16.2 0 29.4 13.2 29.4 29.4v19.2c19.9 5 38.9 12.9 56.5 23.4l13.6-13.6c5.5-5.5 14.4-5.5 19.9 0s5.5 14.4 0 19.9l-21.5 21.6c-4.8 4.8-12.2 5.5-17.8 1.7-20.4-13.7-43.3-23.2-67.5-28-6.6-1.3-11.4-7.1-11.4-13.8V29.4c0-.7-.6-1.3-1.3-1.3h-46.8c-.7 0-1.3.6-1.3 1.3v30.5c0 6.7-4.8 12.5-11.4 13.8-24.1 4.7-47.1 14.2-67.5 28-5.6 3.8-13 3-17.8-1.7L113 78.4c-.5-.5-1.3-.5-1.8 0l-33.1 33.1c-.5.5-.5 1.3 0 1.8l21.6 21.6c4.8 4.8 5.5 12.2 1.7 17.8-13.8 20.4-23.3 43.3-28 67.5-1.3 6.6-7.1 11.4-13.8 11.4H29.4c-.7 0-1.3.6-1.3 1.3v46.8c0 .7.6 1.3 1.3 1.3h30.5c6.7 0 12.5 4.8 13.8 11.4 4.7 24.1 14.2 47.1 28 67.5 3.7 5.6 3 13-1.7 17.8l-21.6 21.5c-2.7 2.3-6.3 3.7-10 3.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">settings</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/settings.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/settings.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 494.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M175.6 494.1h-55.2c-7.2 0-13.3-5.2-14.4-12.3l-3.5-22c-12.3-4.8-23.8-11.4-34.1-19.7l-20.9 8c-6.7 2.6-14.3-.1-17.9-6.4L2 393.9c-3.6-6.2-2.2-14.1 3.4-18.7l17.3-14.1c-2-13-2-26.3 0-39.4l-17.3-14c-5.6-4.5-7-12.5-3.4-18.7l27.6-47.8c3.6-6.2 11.2-8.9 17.9-6.4l20.9 8c10.3-8.3 21.8-14.9 34.1-19.7l3.5-22c1.1-7.1 7.3-12.3 14.4-12.3h55.2c7.1 0 13.2 5.2 14.4 12.3l5 30.7c1.2 8-4.4 15.4-12.4 16.6-7.8 1.1-15.2-4.2-16.5-12l-3-18.4h-30.3l-2.9 18.4c-.9 5.5-4.8 10.1-10.2 11.7-14.3 4.4-27.5 12-38.4 22.2-4.1 3.8-10 5-15.2 3l-17.4-6.6-15.1 26.2L48 304.5c4.3 3.5 6.3 9.2 5 14.7a97.91 97.91 0 000 44.4c1.3 5.4-.7 11.1-5 14.7L33.5 390l15.1 26.2 17.4-6.6c5.2-2 11.1-.8 15.2 3 10.9 10.3 24.1 17.9 38.4 22.2 5.4 1.6 9.3 6.2 10.2 11.7l2.9 18.4H163l2.9-18.4c.9-5.5 4.8-10.1 10.2-11.7 14.3-4.4 27.5-12 38.4-22.2 4.1-3.8 10-5 15.2-3l17.4 6.6 15.1-26.2-14.2-11.7c-4.3-3.5-6.3-9.2-5-14.7 3.4-14.6 3.4-29.8 0-44.4-1.8-7.9 3.1-15.7 10.9-17.6 7.9-1.8 15.7 3.1 17.6 10.9 3.7 15.9 4.3 32.4 1.8 48.5l17.3 14.1c5.6 4.5 7 12.4 3.4 18.7l-27.6 47.8c-3.6 6.2-11.2 8.9-17.9 6.3l-20.9-8c-10.3 8.3-21.8 14.9-34.1 19.7l-3.5 22c-1.1 7.2-7.2 12.5-14.4 12.5z"></path><circle class="lineal-fill" cx="148" cy="341.4" r="43.2"></circle><path class="lineal-stroke" d="M148 399.2c-31.9 0-57.8-25.9-57.8-57.8s25.9-57.8 57.8-57.8 57.8 25.9 57.8 57.8-25.9 57.8-57.8 57.8zm0-86.3c-15.8 0-28.5 12.8-28.5 28.5 0 15.8 12.8 28.5 28.5 28.5 15.8 0 28.5-12.8 28.5-28.5s-12.7-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M476.2 152.7c0-8.6-1-17.2-2.9-25.5l24.1-19.6-27.6-47.8-29 11.1c-12.6-11.8-27.7-20.5-44.2-25.5l-4.9-30.7h-55.3l-4.9 30.7c-16.5 5-31.6 13.7-44.2 25.5l-29-11.1-27.6 47.8 24.1 19.6c-3.9 16.8-3.9 34.2 0 51l-24.1 19.6 27.6 47.8 29-11.1c12.6 11.8 27.7 20.5 44.2 25.5l4.9 30.7h55.2l4.9-30.7c16.5-5 31.6-13.7 44.2-25.5l29 11.1 27.6-47.8-24.1-19.5c2-8.5 3-17 3-25.6zM364 195.8c-23.8 0-43.2-19.3-43.2-43.1s19.3-43.2 43.1-43.2 43.2 19.3 43.2 43.1c0 23.9-19.3 43.2-43.1 43.2z"></path><path class="lineal-stroke" d="M391.6 305.4h-55.2c-7.2 0-13.3-5.3-14.4-12.4l-3.5-22c-12.3-4.8-23.8-11.4-34.1-19.7l-20.9 8c-6.7 2.6-14.3-.1-17.9-6.4L218 205.1c-3.6-6.2-2.1-14.1 3.4-18.7l17.3-14.1c-2-13.1-2-26.3 0-39.4l-17.3-14.1c-5.6-4.5-7-12.4-3.4-18.7l27.6-47.8c3.6-6.2 11.2-8.9 17.9-6.3l20.9 8c10.3-8.3 21.8-14.9 34.1-19.7l3.5-22c1.1-7 7.2-12.3 14.4-12.3h55.2c7.2 0 13.3 5.2 14.4 12.3l3.5 22c12.3 4.8 23.8 11.4 34.1 19.7l20.9-8c6.7-2.6 14.3.1 17.9 6.3l27.6 47.9c3.6 6.2 2.1 14.1-3.4 18.7L489.3 133c2 13.1 2 26.3 0 39.4l17.3 14.1c5.6 4.5 7 12.4 3.4 18.7L482.4 253c-3.6 6.2-11.2 8.9-17.9 6.4l-20.9-8c-10.3 8.3-21.8 14.9-34.1 19.7l-3.5 22c-1.1 7-7.2 12.2-14.4 12.3zm-42.7-29.3h30.3l2.9-18.4c.9-5.5 4.8-10.1 10.2-11.7 14.3-4.4 27.5-12 38.4-22.2 4.1-3.8 10-5 15.2-3l17.4 6.6 15.1-26.2-14.4-11.6c-4.3-3.5-6.3-9.2-5-14.7 3.4-14.6 3.4-29.8 0-44.4-1.3-5.4.7-11.1 5-14.7l14.4-11.7-15.1-26.2-17.4 6.7c-5.2 2-11.1.8-15.2-3-10.9-10.2-24.1-17.8-38.4-22.2-5.4-1.6-9.3-6.2-10.2-11.7l-2.9-18.4h-30.3L346 47.7c-.9 5.5-4.8 10.1-10.2 11.7-14.3 4.4-27.5 12-38.4 22.2-4.1 3.8-10 5-15.2 3l-17.4-6.7-15.1 26.2 14.4 11.7c4.3 3.5 6.3 9.2 5 14.7a97.91 97.91 0 000 44.4c1.3 5.4-.7 11.1-5 14.7l-14.4 11.7 15.1 26.2 17.4-6.6c5.2-2 11.1-.8 15.2 3 10.9 10.2 24.1 17.8 38.4 22.2 5.4 1.6 9.3 6.2 10.2 11.7l2.9 18.3zm15.1-65.6c-31.9 0-57.8-25.9-57.8-57.8s25.9-57.8 57.8-57.8 57.8 25.9 57.8 57.8c-.1 31.9-25.9 57.7-57.8 57.8zm0-86.4c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.6 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 494.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M175.6 494.1h-55.2c-7.2 0-13.3-5.2-14.4-12.3l-3.5-22c-12.3-4.8-23.8-11.4-34.1-19.7l-20.9 8c-6.7 2.6-14.3-.1-17.9-6.4L2 393.9c-3.6-6.2-2.2-14.1 3.4-18.7l17.3-14.1c-2-13-2-26.3 0-39.4l-17.3-14c-5.6-4.5-7-12.5-3.4-18.7l27.6-47.8c3.6-6.2 11.2-8.9 17.9-6.4l20.9 8c10.3-8.3 21.8-14.9 34.1-19.7l3.5-22c1.1-7.1 7.3-12.3 14.4-12.3h55.2c7.1 0 13.2 5.2 14.4 12.3l5 30.7c1.2 8-4.4 15.4-12.4 16.6-7.8 1.1-15.2-4.2-16.5-12l-3-18.4h-30.3l-2.9 18.4c-.9 5.5-4.8 10.1-10.2 11.7-14.3 4.4-27.5 12-38.4 22.2-4.1 3.8-10 5-15.2 3l-17.4-6.6-15.1 26.2L48 304.5c4.3 3.5 6.3 9.2 5 14.7a97.91 97.91 0 000 44.4c1.3 5.4-.7 11.1-5 14.7L33.5 390l15.1 26.2 17.4-6.6c5.2-2 11.1-.8 15.2 3 10.9 10.3 24.1 17.9 38.4 22.2 5.4 1.6 9.3 6.2 10.2 11.7l2.9 18.4H163l2.9-18.4c.9-5.5 4.8-10.1 10.2-11.7 14.3-4.4 27.5-12 38.4-22.2 4.1-3.8 10-5 15.2-3l17.4 6.6 15.1-26.2-14.2-11.7c-4.3-3.5-6.3-9.2-5-14.7 3.4-14.6 3.4-29.8 0-44.4-1.8-7.9 3.1-15.7 10.9-17.6 7.9-1.8 15.7 3.1 17.6 10.9 3.7 15.9 4.3 32.4 1.8 48.5l17.3 14.1c5.6 4.5 7 12.4 3.4 18.7l-27.6 47.8c-3.6 6.2-11.2 8.9-17.9 6.3l-20.9-8c-10.3 8.3-21.8 14.9-34.1 19.7l-3.5 22c-1.1 7.2-7.2 12.5-14.4 12.5z"></path><circle class="lineal-fill" cx="148" cy="341.4" r="43.2"></circle><path class="lineal-stroke" d="M148 399.2c-31.9 0-57.8-25.9-57.8-57.8s25.9-57.8 57.8-57.8 57.8 25.9 57.8 57.8-25.9 57.8-57.8 57.8zm0-86.3c-15.8 0-28.5 12.8-28.5 28.5 0 15.8 12.8 28.5 28.5 28.5 15.8 0 28.5-12.8 28.5-28.5s-12.7-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M476.2 152.7c0-8.6-1-17.2-2.9-25.5l24.1-19.6-27.6-47.8-29 11.1c-12.6-11.8-27.7-20.5-44.2-25.5l-4.9-30.7h-55.3l-4.9 30.7c-16.5 5-31.6 13.7-44.2 25.5l-29-11.1-27.6 47.8 24.1 19.6c-3.9 16.8-3.9 34.2 0 51l-24.1 19.6 27.6 47.8 29-11.1c12.6 11.8 27.7 20.5 44.2 25.5l4.9 30.7h55.2l4.9-30.7c16.5-5 31.6-13.7 44.2-25.5l29 11.1 27.6-47.8-24.1-19.5c2-8.5 3-17 3-25.6zM364 195.8c-23.8 0-43.2-19.3-43.2-43.1s19.3-43.2 43.1-43.2 43.2 19.3 43.2 43.1c0 23.9-19.3 43.2-43.1 43.2z"></path><path class="lineal-stroke" d="M391.6 305.4h-55.2c-7.2 0-13.3-5.3-14.4-12.4l-3.5-22c-12.3-4.8-23.8-11.4-34.1-19.7l-20.9 8c-6.7 2.6-14.3-.1-17.9-6.4L218 205.1c-3.6-6.2-2.1-14.1 3.4-18.7l17.3-14.1c-2-13.1-2-26.3 0-39.4l-17.3-14.1c-5.6-4.5-7-12.4-3.4-18.7l27.6-47.8c3.6-6.2 11.2-8.9 17.9-6.3l20.9 8c10.3-8.3 21.8-14.9 34.1-19.7l3.5-22c1.1-7 7.2-12.3 14.4-12.3h55.2c7.2 0 13.3 5.2 14.4 12.3l3.5 22c12.3 4.8 23.8 11.4 34.1 19.7l20.9-8c6.7-2.6 14.3.1 17.9 6.3l27.6 47.9c3.6 6.2 2.1 14.1-3.4 18.7L489.3 133c2 13.1 2 26.3 0 39.4l17.3 14.1c5.6 4.5 7 12.4 3.4 18.7L482.4 253c-3.6 6.2-11.2 8.9-17.9 6.4l-20.9-8c-10.3 8.3-21.8 14.9-34.1 19.7l-3.5 22c-1.1 7-7.2 12.2-14.4 12.3zm-42.7-29.3h30.3l2.9-18.4c.9-5.5 4.8-10.1 10.2-11.7 14.3-4.4 27.5-12 38.4-22.2 4.1-3.8 10-5 15.2-3l17.4 6.6 15.1-26.2-14.4-11.6c-4.3-3.5-6.3-9.2-5-14.7 3.4-14.6 3.4-29.8 0-44.4-1.3-5.4.7-11.1 5-14.7l14.4-11.7-15.1-26.2-17.4 6.7c-5.2 2-11.1.8-15.2-3-10.9-10.2-24.1-17.8-38.4-22.2-5.4-1.6-9.3-6.2-10.2-11.7l-2.9-18.4h-30.3L346 47.7c-.9 5.5-4.8 10.1-10.2 11.7-14.3 4.4-27.5 12-38.4 22.2-4.1 3.8-10 5-15.2 3l-17.4-6.7-15.1 26.2 14.4 11.7c4.3 3.5 6.3 9.2 5 14.7a97.91 97.91 0 000 44.4c1.3 5.4-.7 11.1-5 14.7l-14.4 11.7 15.1 26.2 17.4-6.6c5.2-2 11.1-.8 15.2 3 10.9 10.2 24.1 17.8 38.4 22.2 5.4 1.6 9.3 6.2 10.2 11.7l2.9 18.3zm15.1-65.6c-31.9 0-57.8-25.9-57.8-57.8s25.9-57.8 57.8-57.8 57.8 25.9 57.8 57.8c-.1 31.9-25.9 57.7-57.8 57.8zm0-86.4c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.6 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">settings-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/settings-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/settings-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.7v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.7h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-41.9c.3-1.2.4-2.4.4-3.6-.2-8-6.9-14.3-14.8-14.1H51.8C39.2 339 29 328.8 29 316.2V51.7c0-12.6 10.2-22.8 22.8-22.8h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-46.7c-8 .2-14.3 6.9-14.1 14.8.2 8 6.9 14.3 14.8 14.1h45.9c28.6 0 51.7-23.2 51.8-51.7V51.7C512 23.2 488.8 0 460.2 0zM310.7 367.9v30.7H201.3v-30.7h109.4z"></path><path class="lineal-fill" d="M220.1 271.6c-12.7-19.8-6.9-46.3 12.9-59s46.3-6.9 59 12.9c9 14 9 32 0 46.1h100.6v-50.3l-30.4-4.9c-4.9-16.3-13.6-31.3-25.3-43.7l11-28.7-47.3-27.3-19.4 23.8c-16.6-3.9-33.9-3.9-50.5 0l-19.4-23.8-47.2 27.3 11 28.7c-11.7 12.4-20.3 27.4-25.3 43.7l-30.3 4.9v50.3h100.6z"></path><path class="lineal-stroke" d="M392.5 286.1H291.9c-8 0-14.5-6.5-14.5-14.5 0-2.8.8-5.5 2.3-7.8 8.4-13.1 4.6-30.6-8.6-39-13.1-8.4-30.6-4.6-39 8.6-5.9 9.3-5.9 21.1 0 30.4 4.3 6.7 2.4 15.7-4.3 20-2.3 1.5-5.1 2.3-7.8 2.3H119.4c-8 0-14.5-6.5-14.4-14.5v-50.3c0-7.1 5.2-13.1 12.2-14.3l21.8-3.5c4.7-12.2 11.3-23.6 19.5-33.7l-7.9-20.6c-2.5-6.6.1-14.1 6.3-17.7l47.3-27.3c6.2-3.5 14-2.1 18.5 3.4l13.9 17.1c12.9-2 26.1-2 39 0l13.9-17.1c4.5-5.5 12.3-7 18.5-3.4l47.3 27.3c6.2 3.6 8.8 11.1 6.3 17.7l-7.9 20.6c8.2 10.2 14.7 21.5 19.4 33.7l21.8 3.5c7 1.1 12.2 7.2 12.2 14.3v50.3c-.1 8-6.6 14.5-14.6 14.5zm-80-29h65.6v-23.5l-18.2-2.9c-5.5-.9-10-4.8-11.6-10.1-4.3-14.2-11.9-27.2-22-38-3.8-4-5-9.9-3-15.1l6.6-17.2-25.9-15-11.6 14.3c-3.5 4.3-9.1 6.2-14.5 5-14.5-3.3-29.5-3.3-43.9 0-5.4 1.2-11-.7-14.5-5l-11.6-14.3-25.9 15 6.6 17.2c2 5.2.8 11-3 15.1-10.1 10.8-17.7 23.8-22 38-1.6 5.3-6.1 9.2-11.6 10.1l-18.2 2.9v23.5h65.6c-.4-2.8-.6-5.7-.6-8.6.4-31.6 26.3-56.8 57.9-56.4 31 .4 56 25.4 56.4 56.4 0 2.9-.2 5.8-.6 8.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/settings-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.7v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.7h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-41.9c.3-1.2.4-2.4.4-3.6-.2-8-6.9-14.3-14.8-14.1H51.8C39.2 339 29 328.8 29 316.2V51.7c0-12.6 10.2-22.8 22.8-22.8h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-46.7c-8 .2-14.3 6.9-14.1 14.8.2 8 6.9 14.3 14.8 14.1h45.9c28.6 0 51.7-23.2 51.8-51.7V51.7C512 23.2 488.8 0 460.2 0zM310.7 367.9v30.7H201.3v-30.7h109.4z"></path><path class="lineal-fill" d="M220.1 271.6c-12.7-19.8-6.9-46.3 12.9-59s46.3-6.9 59 12.9c9 14 9 32 0 46.1h100.6v-50.3l-30.4-4.9c-4.9-16.3-13.6-31.3-25.3-43.7l11-28.7-47.3-27.3-19.4 23.8c-16.6-3.9-33.9-3.9-50.5 0l-19.4-23.8-47.2 27.3 11 28.7c-11.7 12.4-20.3 27.4-25.3 43.7l-30.3 4.9v50.3h100.6z"></path><path class="lineal-stroke" d="M392.5 286.1H291.9c-8 0-14.5-6.5-14.5-14.5 0-2.8.8-5.5 2.3-7.8 8.4-13.1 4.6-30.6-8.6-39-13.1-8.4-30.6-4.6-39 8.6-5.9 9.3-5.9 21.1 0 30.4 4.3 6.7 2.4 15.7-4.3 20-2.3 1.5-5.1 2.3-7.8 2.3H119.4c-8 0-14.5-6.5-14.4-14.5v-50.3c0-7.1 5.2-13.1 12.2-14.3l21.8-3.5c4.7-12.2 11.3-23.6 19.5-33.7l-7.9-20.6c-2.5-6.6.1-14.1 6.3-17.7l47.3-27.3c6.2-3.5 14-2.1 18.5 3.4l13.9 17.1c12.9-2 26.1-2 39 0l13.9-17.1c4.5-5.5 12.3-7 18.5-3.4l47.3 27.3c6.2 3.6 8.8 11.1 6.3 17.7l-7.9 20.6c8.2 10.2 14.7 21.5 19.4 33.7l21.8 3.5c7 1.1 12.2 7.2 12.2 14.3v50.3c-.1 8-6.6 14.5-14.6 14.5zm-80-29h65.6v-23.5l-18.2-2.9c-5.5-.9-10-4.8-11.6-10.1-4.3-14.2-11.9-27.2-22-38-3.8-4-5-9.9-3-15.1l6.6-17.2-25.9-15-11.6 14.3c-3.5 4.3-9.1 6.2-14.5 5-14.5-3.3-29.5-3.3-43.9 0-5.4 1.2-11-.7-14.5-5l-11.6-14.3-25.9 15 6.6 17.2c2 5.2.8 11-3 15.1-10.1 10.8-17.7 23.8-22 38-1.6 5.3-6.1 9.2-11.6 10.1l-18.2 2.9v23.5h65.6c-.4-2.8-.6-5.7-.6-8.6.4-31.6 26.3-56.8 57.9-56.4 31 .4 56 25.4 56.4 56.4 0 2.9-.2 5.8-.6 8.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">settings-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/settings-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/settings-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shield.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M169.9 409.6c-5.5 0-10.9-1.2-15.8-3.5C107.8 384.8 0 327.5 0 255.5V72.1c0-10.7 8.7-19.4 19.4-19.5 2.1 0 4.2.3 6.1 1 9.2 3.1 18.9 4.7 28.6 4.6 31.5.1 60.7-16.3 76.9-43.3C136.6 5.7 146.6 0 157.4 0h25c10.8.1 20.8 5.7 26.4 14.9 16.2 27 45.4 43.4 76.9 43.3 9.7 0 19.4-1.6 28.6-4.6 10.2-3.4 21.2 2.1 24.6 12.3.7 2 1 4.1 1 6.1v48c0 6.5-5.3 11.8-11.7 11.8-6.5 0-11.8-5.3-11.8-11.7V77.6c-10 2.8-20.3 4.2-30.6 4.2-39.7.2-76.5-20.6-97-54.6-1.3-2.2-3.7-3.6-6.3-3.6h-25c-2.6 0-5 1.4-6.3 3.6-20.5 34-57.3 54.8-97 54.6-10.3 0-20.6-1.4-30.6-4.2v178c0 47.7 72.5 98 140.4 129.3 3.8 1.7 8.2 1.7 12 0 67.9-31.3 140.4-81.6 140.4-129.3v-74.9c0-6.5 5.3-11.8 11.8-11.7 6.5 0 11.7 5.3 11.7 11.7v74.9c0 72-107.8 129.3-154.1 150.6-5 2.2-10.4 3.4-15.9 3.4z"></path><path class="lineal-fill" d="M156 269l-62.2-31.1c-11.8-5.9-16.6-20.2-10.7-32 5.9-11.8 20.2-16.6 32-10.7l44.9 22.5 56.6-70.7c8.2-10.3 23.2-12 33.5-3.7 10.3 8.2 12 23.2 3.7 33.5l-68.6 85.8c-6.9 8.8-19.1 11.5-29.2 6.4z"></path><path class="lineal-stroke" d="M166.7 283.3c-5.5 0-11-1.3-15.9-3.8l-62.2-31.1c-17.6-8.8-24.7-30.2-15.9-47.8s30.2-24.7 47.8-15.9l36.4 18.2 50.6-63.3c12.3-15.4 34.7-17.9 50.1-5.6 15.4 12.3 17.9 34.7 5.6 50.1l-68.6 85.8c-6.8 8.5-17.1 13.4-27.9 13.4zm-62.2-78.8c-6.7 0-12.1 5.4-12.1 12.1 0 4.6 2.6 8.8 6.7 10.8l62.2 31.1c5.1 2.6 11.3 1.2 14.9-3.3l68.6-85.8c4.3-5.1 3.7-12.8-1.4-17.1-5.1-4.3-12.8-3.7-17.1 1.4-.1.2-.3.3-.4.5l-56.6 70.7c-3.5 4.3-9.5 5.6-14.4 3.2L110 205.6c-1.7-.7-3.6-1.1-5.5-1.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shield.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M169.9 409.6c-5.5 0-10.9-1.2-15.8-3.5C107.8 384.8 0 327.5 0 255.5V72.1c0-10.7 8.7-19.4 19.4-19.5 2.1 0 4.2.3 6.1 1 9.2 3.1 18.9 4.7 28.6 4.6 31.5.1 60.7-16.3 76.9-43.3C136.6 5.7 146.6 0 157.4 0h25c10.8.1 20.8 5.7 26.4 14.9 16.2 27 45.4 43.4 76.9 43.3 9.7 0 19.4-1.6 28.6-4.6 10.2-3.4 21.2 2.1 24.6 12.3.7 2 1 4.1 1 6.1v48c0 6.5-5.3 11.8-11.7 11.8-6.5 0-11.8-5.3-11.8-11.7V77.6c-10 2.8-20.3 4.2-30.6 4.2-39.7.2-76.5-20.6-97-54.6-1.3-2.2-3.7-3.6-6.3-3.6h-25c-2.6 0-5 1.4-6.3 3.6-20.5 34-57.3 54.8-97 54.6-10.3 0-20.6-1.4-30.6-4.2v178c0 47.7 72.5 98 140.4 129.3 3.8 1.7 8.2 1.7 12 0 67.9-31.3 140.4-81.6 140.4-129.3v-74.9c0-6.5 5.3-11.8 11.8-11.7 6.5 0 11.7 5.3 11.7 11.7v74.9c0 72-107.8 129.3-154.1 150.6-5 2.2-10.4 3.4-15.9 3.4z"></path><path class="lineal-fill" d="M156 269l-62.2-31.1c-11.8-5.9-16.6-20.2-10.7-32 5.9-11.8 20.2-16.6 32-10.7l44.9 22.5 56.6-70.7c8.2-10.3 23.2-12 33.5-3.7 10.3 8.2 12 23.2 3.7 33.5l-68.6 85.8c-6.9 8.8-19.1 11.5-29.2 6.4z"></path><path class="lineal-stroke" d="M166.7 283.3c-5.5 0-11-1.3-15.9-3.8l-62.2-31.1c-17.6-8.8-24.7-30.2-15.9-47.8s30.2-24.7 47.8-15.9l36.4 18.2 50.6-63.3c12.3-15.4 34.7-17.9 50.1-5.6 15.4 12.3 17.9 34.7 5.6 50.1l-68.6 85.8c-6.8 8.5-17.1 13.4-27.9 13.4zm-62.2-78.8c-6.7 0-12.1 5.4-12.1 12.1 0 4.6 2.6 8.8 6.7 10.8l62.2 31.1c5.1 2.6 11.3 1.2 14.9-3.3l68.6-85.8c4.3-5.1 3.7-12.8-1.4-17.1-5.1-4.3-12.8-3.7-17.1 1.4-.1.2-.3.3-.4.5l-56.6 70.7c-3.5 4.3-9.5 5.6-14.4 3.2L110 205.6c-1.7-.7-3.6-1.1-5.5-1.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shield</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shield.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shield.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.82 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shield-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M169.91 409.6a38 38 0 01-15.84-3.47C107.75 384.81 0 327.47 0 255.5V72.05a19.43 19.43 0 0125.54-18.47 89.73 89.73 0 0028.58 4.64A89.34 89.34 0 00131 14.91 31.11 31.11 0 01157.39 0h25a31.11 31.11 0 0126.39 14.91 89.33 89.33 0 0076.92 43.31 89.69 89.69 0 0028.58-4.64 19.43 19.43 0 0125.54 18.47v48a11.76 11.76 0 11-23.52 0v-42.5a113.25 113.25 0 01-30.6 4.19 112.66 112.66 0 01-97-54.61 7.36 7.36 0 00-6.3-3.61h-25a7.33 7.33 0 00-6.29 3.61 112.69 112.69 0 01-97 54.61 112.86 112.86 0 01-30.6-4.19v178c0 47.69 72.52 98 140.38 129.27a14.42 14.42 0 0012 0c67.89-31.28 140.41-81.63 140.41-129.32v-74.87a11.76 11.76 0 0123.52 0v74.87c0 72-107.75 129.31-154.07 150.63a38 38 0 01-15.84 3.47z"></path><path class="lineal-fill" d="M232.48 142.23a27.23 27.23 0 00-38.5 0l-24.07 24.07-24.06-24.07a27.23 27.23 0 00-38.51 38.5l24.07 24.07-24.07 24.06a27.23 27.23 0 0038.51 38.51l24.06-24.07L194 267.37a27.23 27.23 0 0038.5-38.51l-24.09-24.06 24.07-24.07a27.23 27.23 0 000-38.5z"></path><path class="lineal-stroke" d="M213.23 287.1a38.74 38.74 0 01-27.57-11.42l-15.75-15.75-15.75 15.75A39 39 0 0199 220.55l15.75-15.75L99 189.05a39 39 0 1155.13-55.13l15.75 15.75 15.75-15.75a39 39 0 0155.13 55.13L225 204.8l15.75 15.75a39 39 0 01-27.56 66.55zm-43.32-55.56a11.76 11.76 0 018.32 3.45l24.06 24.06a15.46 15.46 0 0021.87-21.87l-24.06-24.07a11.77 11.77 0 010-16.63l24.06-24.06a15.48 15.48 0 000-21.87 15.46 15.46 0 00-21.87 0l-24.06 24.06a11.75 11.75 0 01-16.63 0l-24.07-24.06a15.46 15.46 0 00-21.87 0 15.48 15.48 0 000 21.87l24.06 24.06a11.75 11.75 0 010 16.63l-24.06 24.07a15.46 15.46 0 1021.87 21.87L161.6 235a11.72 11.72 0 018.31-3.45z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 339.82 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shield-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M169.91 409.6a38 38 0 01-15.84-3.47C107.75 384.81 0 327.47 0 255.5V72.05a19.43 19.43 0 0125.54-18.47 89.73 89.73 0 0028.58 4.64A89.34 89.34 0 00131 14.91 31.11 31.11 0 01157.39 0h25a31.11 31.11 0 0126.39 14.91 89.33 89.33 0 0076.92 43.31 89.69 89.69 0 0028.58-4.64 19.43 19.43 0 0125.54 18.47v48a11.76 11.76 0 11-23.52 0v-42.5a113.25 113.25 0 01-30.6 4.19 112.66 112.66 0 01-97-54.61 7.36 7.36 0 00-6.3-3.61h-25a7.33 7.33 0 00-6.29 3.61 112.69 112.69 0 01-97 54.61 112.86 112.86 0 01-30.6-4.19v178c0 47.69 72.52 98 140.38 129.27a14.42 14.42 0 0012 0c67.89-31.28 140.41-81.63 140.41-129.32v-74.87a11.76 11.76 0 0123.52 0v74.87c0 72-107.75 129.31-154.07 150.63a38 38 0 01-15.84 3.47z"></path><path class="lineal-fill" d="M232.48 142.23a27.23 27.23 0 00-38.5 0l-24.07 24.07-24.06-24.07a27.23 27.23 0 00-38.51 38.5l24.07 24.07-24.07 24.06a27.23 27.23 0 0038.51 38.51l24.06-24.07L194 267.37a27.23 27.23 0 0038.5-38.51l-24.09-24.06 24.07-24.07a27.23 27.23 0 000-38.5z"></path><path class="lineal-stroke" d="M213.23 287.1a38.74 38.74 0 01-27.57-11.42l-15.75-15.75-15.75 15.75A39 39 0 0199 220.55l15.75-15.75L99 189.05a39 39 0 1155.13-55.13l15.75 15.75 15.75-15.75a39 39 0 0155.13 55.13L225 204.8l15.75 15.75a39 39 0 01-27.56 66.55zm-43.32-55.56a11.76 11.76 0 018.32 3.45l24.06 24.06a15.46 15.46 0 0021.87-21.87l-24.06-24.07a11.77 11.77 0 010-16.63l24.06-24.06a15.48 15.48 0 000-21.87 15.46 15.46 0 00-21.87 0l-24.06 24.06a11.75 11.75 0 01-16.63 0l-24.07-24.06a15.46 15.46 0 00-21.87 0 15.48 15.48 0 000 21.87l24.06 24.06a11.75 11.75 0 010 16.63l-24.06 24.07a15.46 15.46 0 1021.87 21.87L161.6 235a11.72 11.72 0 018.31-3.45z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shield-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shield-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shield-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 499.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shop.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M159.7 231.9c-26.6 0-48.2-21.6-48.2-48.2V15.2h96.3v168.6c0 26.5-21.5 48.1-48.1 48.1zm192.6 0c-26.6 0-48.2-21.6-48.2-48.2V15.2h96.3v168.6c.1 26.5-21.5 48.1-48.1 48.1zm-160.9 73.9h129.2V484H191.4z"></path><path class="lineal-stroke" d="M496.8 98.6c8.4 0 15.2-6.8 15.2-15.2V52.1C512 23.3 488.7 0 459.9 0H52.1C23.3 0 0 23.3 0 52.1v131.6c0 19.4 8.9 37.7 24.1 49.7V484c0 8.4 6.8 15.2 15.2 15.2h433.5c8.4 0 15.2-6.8 15.2-15.2V305.8c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8v163H335.8v-163c0-8.4-6.8-15.2-15.2-15.2H191.4c-8.4 0-15.2 6.8-15.2 15.2v163H54.4V246.4c21.5 3.1 43-5.1 57.1-21.6 22.6 26.6 62.5 29.8 89.1 7.2 2.6-2.2 5-4.6 7.2-7.2 22.6 26.6 62.5 29.8 89.1 7.2 2.6-2.2 5-4.6 7.2-7.2 22.6 26.6 62.5 29.8 89.1 7.2 2.6-2.2 5-4.6 7.2-7.2 22.6 26.6 62.6 29.9 89.2 7.2 14.2-12 22.3-29.7 22.3-48.3v-26.2c0-8.4-6.8-15.2-15.2-15.2-8.4 0-15.2 6.8-15.2 15.2v26.2c0 18.2-14.8 33-33 33s-33-14.8-33-33V30.3h44.2c12 0 21.7 9.7 21.8 21.8v31.3c.2 8.3 7 15.1 15.3 15.2zM206.6 320.9h98.9v147.9h-98.9V320.9zM63.3 216.7c-18.2 0-33-14.8-33-33V52.1c0-12 9.7-21.7 21.8-21.8h44.2v153.4c0 18.3-14.7 33-33 33zm96.4 0c-18.2 0-33-14.8-33-33V30.3h66v153.4c0 18.3-14.8 33-33 33zm96.3 0c-18.2 0-33-14.8-33-33V30.3h66v153.4c0 18.3-14.8 33-33 33zm96.3 0c-18.2 0-33-14.8-33-33V30.3h66v153.4c0 18.3-14.7 33-33 33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 499.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shop.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M159.7 231.9c-26.6 0-48.2-21.6-48.2-48.2V15.2h96.3v168.6c0 26.5-21.5 48.1-48.1 48.1zm192.6 0c-26.6 0-48.2-21.6-48.2-48.2V15.2h96.3v168.6c.1 26.5-21.5 48.1-48.1 48.1zm-160.9 73.9h129.2V484H191.4z"></path><path class="lineal-stroke" d="M496.8 98.6c8.4 0 15.2-6.8 15.2-15.2V52.1C512 23.3 488.7 0 459.9 0H52.1C23.3 0 0 23.3 0 52.1v131.6c0 19.4 8.9 37.7 24.1 49.7V484c0 8.4 6.8 15.2 15.2 15.2h433.5c8.4 0 15.2-6.8 15.2-15.2V305.8c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8v163H335.8v-163c0-8.4-6.8-15.2-15.2-15.2H191.4c-8.4 0-15.2 6.8-15.2 15.2v163H54.4V246.4c21.5 3.1 43-5.1 57.1-21.6 22.6 26.6 62.5 29.8 89.1 7.2 2.6-2.2 5-4.6 7.2-7.2 22.6 26.6 62.5 29.8 89.1 7.2 2.6-2.2 5-4.6 7.2-7.2 22.6 26.6 62.5 29.8 89.1 7.2 2.6-2.2 5-4.6 7.2-7.2 22.6 26.6 62.6 29.9 89.2 7.2 14.2-12 22.3-29.7 22.3-48.3v-26.2c0-8.4-6.8-15.2-15.2-15.2-8.4 0-15.2 6.8-15.2 15.2v26.2c0 18.2-14.8 33-33 33s-33-14.8-33-33V30.3h44.2c12 0 21.7 9.7 21.8 21.8v31.3c.2 8.3 7 15.1 15.3 15.2zM206.6 320.9h98.9v147.9h-98.9V320.9zM63.3 216.7c-18.2 0-33-14.8-33-33V52.1c0-12 9.7-21.7 21.8-21.8h44.2v153.4c0 18.3-14.7 33-33 33zm96.4 0c-18.2 0-33-14.8-33-33V30.3h66v153.4c0 18.3-14.8 33-33 33zm96.3 0c-18.2 0-33-14.8-33-33V30.3h66v153.4c0 18.3-14.8 33-33 33zm96.3 0c-18.2 0-33-14.8-33-33V30.3h66v153.4c0 18.3-14.7 33-33 33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shop</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shop.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shop.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 466.4" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shop-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M201.4 172.5h-96l26.1-158.4h83zm205.2 0h-96L297.5 14.1h83zm-216.7 97.1c7.2-7 16.8-10.9 26.9-10.8 9.6 0 18.8 3.1 26.9 5.8 4 1.4 8.1 2.6 12.3 3.5 4.2-.9 8.3-2.1 12.3-3.5 8.1-2.7 17.3-5.8 26.9-5.8 10-.1 19.7 3.7 26.9 10.8 24.4 22.9 15.9 48.4 10.9 63.7l-.3.8c-4.6 14-22 59.8-51.4 59.8-15.6 0-20.9-2.5-24.8-4.4l-.6-.3-.6.3c-3.9 1.9-9.1 4.4-24.8 4.4-29.3 0-46.7-45.8-51.4-59.8l-.3-.8c-4.8-15.3-13.3-40.8 11.1-63.7z"></path><path class="lineal-stroke" d="M511.1 147.4l-6.4-25.9c-1.9-7.6-9.6-12.1-17.2-10.2-7.5 1.9-12.1 9.5-10.3 17l6.4 25.9c.4 1.8-.7 3.6-2.5 4.1-.3.1-.5.1-.8.1h-61.7l-14.2-86-7.3-44.1h52.6c1.5 0 2.9 1 3.2 2.5l6.6 26.8c1.9 7.6 9.6 12.1 17.2 10.2 7.5-1.9 12.1-9.5 10.3-17L480.5 24C477 9.9 464.3 0 449.8 0H62.2C47.7 0 35 9.9 31.5 24L.9 147.4c-4.2 17 6.1 34.1 23.1 38.3 2.5.6 5.1.9 7.6.9h8.1v265.6c0 7.8 6.3 14.1 14.2 14.1h404.2c7.8 0 14.1-6.3 14.1-14.1V257.8c0-7.8-6.3-14.2-14.1-14.2s-14.2 6.3-14.2 14.1V438H68V186.7h412.4c17.5 0 31.6-14.2 31.6-31.6 0-2.6-.3-5.2-.9-7.7zM227.5 28.3h56.9l10.8 130.1h-78.4l10.7-130.1zM29 157.1c-.7-.8-.9-1.9-.6-2.9L59 30.8c.4-1.5 1.7-2.5 3.2-2.5h52.6l-5.3 32.1-16.2 98H31.6c-1 0-2-.5-2.6-1.3zm98.3-30.8l16.2-98h55.6l-10.7 130.1H122l5.3-32.1zm196.3 32.1L315.2 57l-2.4-28.7h55.6l16.2 98 5.3 32.1h-66.3z"></path><path class="lineal-stroke" d="M256 220c-7.8 0-14.1 6.3-14.1 14.1v15c-7.4-2.3-15.9-4.4-25-4.4-13.6-.1-26.8 5.1-36.6 14.6-31 29.1-19.9 62.4-14.6 78.4l.3.8c6.9 20.9 27 69.5 64.8 69.5 12.6 0 19.9-1.5 25.3-3.4 5.4 2 12.8 3.4 25.3 3.4 37.8 0 57.9-48.6 64.8-69.5l.3-.8c5.3-16 16.3-49.3-14.6-78.4-9.8-9.5-22.9-14.7-36.6-14.6-9.1 0-17.6 2.1-25 4.4v-15c-.1-7.8-6.4-14.1-14.3-14.1zm39.2 53c6.4-.1 12.7 2.4 17.2 6.9 16.5 15.5 13 31.3 7.1 48.9l-.3.8c-8.2 24.9-23.2 50.1-37.9 50.1-12.4 0-15.8-1.7-18.6-3l-.7-.3c-3.9-1.8-8.3-1.8-12.2 0l-.6.3c-2.8 1.3-6.2 3-18.6 3-14.8 0-29.7-25.1-37.9-50l-.3-.8c-5.8-17.6-9.3-33.4 7.1-48.9 4.5-4.6 10.8-7.1 17.2-6.9 7.3 0 15 2.6 22.5 5 4.6 1.7 9.4 3 14.2 4 1.7.3 3.3.3 5 0 4.8-1 9.6-2.3 14.2-4 7.6-2.6 15.3-5.1 22.6-5.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 466.4" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shop-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M201.4 172.5h-96l26.1-158.4h83zm205.2 0h-96L297.5 14.1h83zm-216.7 97.1c7.2-7 16.8-10.9 26.9-10.8 9.6 0 18.8 3.1 26.9 5.8 4 1.4 8.1 2.6 12.3 3.5 4.2-.9 8.3-2.1 12.3-3.5 8.1-2.7 17.3-5.8 26.9-5.8 10-.1 19.7 3.7 26.9 10.8 24.4 22.9 15.9 48.4 10.9 63.7l-.3.8c-4.6 14-22 59.8-51.4 59.8-15.6 0-20.9-2.5-24.8-4.4l-.6-.3-.6.3c-3.9 1.9-9.1 4.4-24.8 4.4-29.3 0-46.7-45.8-51.4-59.8l-.3-.8c-4.8-15.3-13.3-40.8 11.1-63.7z"></path><path class="lineal-stroke" d="M511.1 147.4l-6.4-25.9c-1.9-7.6-9.6-12.1-17.2-10.2-7.5 1.9-12.1 9.5-10.3 17l6.4 25.9c.4 1.8-.7 3.6-2.5 4.1-.3.1-.5.1-.8.1h-61.7l-14.2-86-7.3-44.1h52.6c1.5 0 2.9 1 3.2 2.5l6.6 26.8c1.9 7.6 9.6 12.1 17.2 10.2 7.5-1.9 12.1-9.5 10.3-17L480.5 24C477 9.9 464.3 0 449.8 0H62.2C47.7 0 35 9.9 31.5 24L.9 147.4c-4.2 17 6.1 34.1 23.1 38.3 2.5.6 5.1.9 7.6.9h8.1v265.6c0 7.8 6.3 14.1 14.2 14.1h404.2c7.8 0 14.1-6.3 14.1-14.1V257.8c0-7.8-6.3-14.2-14.1-14.2s-14.2 6.3-14.2 14.1V438H68V186.7h412.4c17.5 0 31.6-14.2 31.6-31.6 0-2.6-.3-5.2-.9-7.7zM227.5 28.3h56.9l10.8 130.1h-78.4l10.7-130.1zM29 157.1c-.7-.8-.9-1.9-.6-2.9L59 30.8c.4-1.5 1.7-2.5 3.2-2.5h52.6l-5.3 32.1-16.2 98H31.6c-1 0-2-.5-2.6-1.3zm98.3-30.8l16.2-98h55.6l-10.7 130.1H122l5.3-32.1zm196.3 32.1L315.2 57l-2.4-28.7h55.6l16.2 98 5.3 32.1h-66.3z"></path><path class="lineal-stroke" d="M256 220c-7.8 0-14.1 6.3-14.1 14.1v15c-7.4-2.3-15.9-4.4-25-4.4-13.6-.1-26.8 5.1-36.6 14.6-31 29.1-19.9 62.4-14.6 78.4l.3.8c6.9 20.9 27 69.5 64.8 69.5 12.6 0 19.9-1.5 25.3-3.4 5.4 2 12.8 3.4 25.3 3.4 37.8 0 57.9-48.6 64.8-69.5l.3-.8c5.3-16 16.3-49.3-14.6-78.4-9.8-9.5-22.9-14.7-36.6-14.6-9.1 0-17.6 2.1-25 4.4v-15c-.1-7.8-6.4-14.1-14.3-14.1zm39.2 53c6.4-.1 12.7 2.4 17.2 6.9 16.5 15.5 13 31.3 7.1 48.9l-.3.8c-8.2 24.9-23.2 50.1-37.9 50.1-12.4 0-15.8-1.7-18.6-3l-.7-.3c-3.9-1.8-8.3-1.8-12.2 0l-.6.3c-2.8 1.3-6.2 3-18.6 3-14.8 0-29.7-25.1-37.9-50l-.3-.8c-5.8-17.6-9.3-33.4 7.1-48.9 4.5-4.6 10.8-7.1 17.2-6.9 7.3 0 15 2.6 22.5 5 4.6 1.7 9.4 3 14.2 4 1.7.3 3.3.3 5 0 4.8-1 9.6-2.3 14.2-4 7.6-2.6 15.3-5.1 22.6-5.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shop-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shop-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shop-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 442.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shope-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M459.9 15.2H52.1c-20.4 0-36.9 16.5-36.9 36.9v101.3c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.2c0 26.6 21.6 48.2 48.2 48.2S208 180 208 153.4c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.2c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.1c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.2V52.1c-.4-20.4-16.9-36.9-37.3-36.9z"></path><path class="lineal-stroke" d="M459.9 0H52.1C23.3 0 0 23.3 0 52.1v101.3c0 22.3 11.7 42.9 30.8 54.3v219.2c0 8.4 6.8 15.2 15.2 15.2h420c8.4 0 15.2-6.8 15.2-15.2V273.8c0-8.4-6.8-15.2-15.2-15.2-8.4 0-15.2 6.8-15.2 15.2v137.9H335.5v-130c0-8.4-6.8-15.2-15.2-15.2H191.7c-8.4 0-15.2 6.8-15.2 15.2v56.1c0 8.4 6.8 15.2 15.2 15.2s15.2-6.8 15.2-15.2v-41h98.2v114.9H61.2v-195c.7 0 1.4.1 2.2.1 18.5 0 36.1-8.1 48.2-22.2 22.7 26.6 62.6 29.8 89.2 7.2 2.6-2.2 5-4.6 7.2-7.2 22.7 26.6 62.6 29.8 89.2 7.1 2.6-2.2 5-4.6 7.1-7.1 22.7 26.6 62.6 29.8 89.2 7.2 2.6-2.2 5-4.6 7.2-7.2 22.7 26.6 62.6 29.8 89.2 7.1 14.1-12 22.3-29.7 22.3-48.2V52.1C512 23.3 488.7 0 459.9 0zm21.8 153.4c0 18.2-14.8 33-33 33s-33-14.8-33-33v-44.1c0-8.4-6.8-15.2-15.2-15.2-8.4 0-15.2 6.8-15.2 15.2v44.1c0 18.2-14.8 33-33 33s-33-14.8-33-33v-73c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8v73c0 18.2-14.8 33-33 33s-33-14.8-33-33v-44.1c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8v44.1c0 18.2-14.8 33-33 33s-33-14.8-33-33v-73c0-8.4-6.8-15.2-15.2-15.2S96.1 72 96.1 80.4v73c0 18.2-14.8 33-33 33s-33-14.8-33-33V52.1c0-12 9.8-21.8 21.8-21.8h407.8c12 0 21.7 9.7 21.8 21.8v101.3h.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 442.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shope-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M459.9 15.2H52.1c-20.4 0-36.9 16.5-36.9 36.9v101.3c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.2c0 26.6 21.6 48.2 48.2 48.2S208 180 208 153.4c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.2c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.1c0 26.6 21.6 48.2 48.2 48.2s48.2-21.6 48.2-48.2V52.1c-.4-20.4-16.9-36.9-37.3-36.9z"></path><path class="lineal-stroke" d="M459.9 0H52.1C23.3 0 0 23.3 0 52.1v101.3c0 22.3 11.7 42.9 30.8 54.3v219.2c0 8.4 6.8 15.2 15.2 15.2h420c8.4 0 15.2-6.8 15.2-15.2V273.8c0-8.4-6.8-15.2-15.2-15.2-8.4 0-15.2 6.8-15.2 15.2v137.9H335.5v-130c0-8.4-6.8-15.2-15.2-15.2H191.7c-8.4 0-15.2 6.8-15.2 15.2v56.1c0 8.4 6.8 15.2 15.2 15.2s15.2-6.8 15.2-15.2v-41h98.2v114.9H61.2v-195c.7 0 1.4.1 2.2.1 18.5 0 36.1-8.1 48.2-22.2 22.7 26.6 62.6 29.8 89.2 7.2 2.6-2.2 5-4.6 7.2-7.2 22.7 26.6 62.6 29.8 89.2 7.1 2.6-2.2 5-4.6 7.1-7.1 22.7 26.6 62.6 29.8 89.2 7.2 2.6-2.2 5-4.6 7.2-7.2 22.7 26.6 62.6 29.8 89.2 7.1 14.1-12 22.3-29.7 22.3-48.2V52.1C512 23.3 488.7 0 459.9 0zm21.8 153.4c0 18.2-14.8 33-33 33s-33-14.8-33-33v-44.1c0-8.4-6.8-15.2-15.2-15.2-8.4 0-15.2 6.8-15.2 15.2v44.1c0 18.2-14.8 33-33 33s-33-14.8-33-33v-73c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8v73c0 18.2-14.8 33-33 33s-33-14.8-33-33v-44.1c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8v44.1c0 18.2-14.8 33-33 33s-33-14.8-33-33v-73c0-8.4-6.8-15.2-15.2-15.2S96.1 72 96.1 80.4v73c0 18.2-14.8 33-33 33s-33-14.8-33-33V52.1c0-12 9.8-21.8 21.8-21.8h407.8c12 0 21.7 9.7 21.8 21.8v101.3h.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shope-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shope-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shope-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shopping-basket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shopping-basket.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shopping-basket.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 506.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-cart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M146.9 388h304.2L479 229.8H118.9z"></path><path class="lineal-stroke" d="M508.4 119.6c-2.9-3.4-7.2-5.4-11.7-5.4h-70.5c-8.4-.2-15.4 6.4-15.6 14.8-.2 8.4 6.4 15.4 14.8 15.6h53.2l-12.4 70H131.7l-12.4-70h222.8c8.4.2 15.4-6.4 15.6-14.8s-6.4-15.4-14.8-15.6H113.5L94.3 12.4C93 5.2 86.7 0 79.4 0H15.2C6.8-.2-.2 6.4-.4 14.8S6 30.2 14.4 30.4h52.3l65.1 360.2c1.3 7.3 7.6 12.6 15 12.6h66.9c20.2 0 36.5 16.4 36.5 36.5 0 20.2-16.4 36.5-36.5 36.5s-36.5-16.4-36.5-36.5c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8-.1 37 29.7 67.1 66.7 67.3 37 .1 67.1-29.7 67.3-66.7.1-13.2-3.8-26-11-37h114.8c20.2 0 36.5 16.4 36.5 36.5s-16.4 36.5-36.5 36.5-36.5-16.4-36.5-36.5c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8-.1 37 29.7 67.1 66.7 67.3 37 .1 67.1-29.7 67.3-66.7.1-13.2-3.8-26-11-37h10.4c7.4 0 13.7-5.3 15-12.6l28-158.2L511.8 132c.8-4.4-.5-9-3.4-12.4zm-70 253.2H159.6L137.1 245H461l-22.6 127.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 506.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-cart.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M146.9 388h304.2L479 229.8H118.9z"></path><path class="lineal-stroke" d="M508.4 119.6c-2.9-3.4-7.2-5.4-11.7-5.4h-70.5c-8.4-.2-15.4 6.4-15.6 14.8-.2 8.4 6.4 15.4 14.8 15.6h53.2l-12.4 70H131.7l-12.4-70h222.8c8.4.2 15.4-6.4 15.6-14.8s-6.4-15.4-14.8-15.6H113.5L94.3 12.4C93 5.2 86.7 0 79.4 0H15.2C6.8-.2-.2 6.4-.4 14.8S6 30.2 14.4 30.4h52.3l65.1 360.2c1.3 7.3 7.6 12.6 15 12.6h66.9c20.2 0 36.5 16.4 36.5 36.5 0 20.2-16.4 36.5-36.5 36.5s-36.5-16.4-36.5-36.5c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8-.1 37 29.7 67.1 66.7 67.3 37 .1 67.1-29.7 67.3-66.7.1-13.2-3.8-26-11-37h114.8c20.2 0 36.5 16.4 36.5 36.5s-16.4 36.5-36.5 36.5-36.5-16.4-36.5-36.5c-.2-8.4-7.2-15-15.6-14.8-8.1.2-14.6 6.7-14.8 14.8-.1 37 29.7 67.1 66.7 67.3 37 .1 67.1-29.7 67.3-66.7.1-13.2-3.8-26-11-37h10.4c7.4 0 13.7-5.3 15-12.6l28-158.2L511.8 132c.8-4.4-.5-9-3.4-12.4zm-70 253.2H159.6L137.1 245H461l-22.6 127.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shopping-cart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shopping-cart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/shopping-cart.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 340.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/show.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M256 340.1c-58.1 0-120.5-28.2-180.4-81.6C31 218.9 3.6 179.7 2.5 178c-3.3-4.8-3.3-11.1 0-15.9 1.2-1.6 28.5-40.8 73.1-80.5C135.5 28.2 197.9 0 256 0c38.6 0 78.6 12.1 118.9 36C454 82.9 507.3 158.9 509.5 162.1c4.9 6 3.9 14.8-2.1 19.7-6 4.9-14.8 3.9-19.7-2.1-.4-.5-.8-1.1-1.2-1.7-.5-.7-52.2-74.3-125.9-118-35.8-21.3-71.1-32.1-104.6-32.1C148 27.9 55.2 139 31.4 170.1c23.9 31 116.8 142.1 224.6 142.1 64.2 0 122.8-40 160.7-73.5 5.4-5.5 14.3-5.6 19.8-.2 5.5 5.4 5.6 14.3.2 19.8-.5.5-.9.9-1.4 1.3-59.6 52.7-121.6 80.5-179.3 80.5z"></path><path class="lineal-fill" d="M330.1 96c-40.9-40.9-107.2-40.9-148.2 0s-40.9 107.2 0 148.2c40.9 40.9 107.2 40.9 148.1 0l-74-74.1L330.1 96z"></path><path class="lineal-stroke" d="M256 288.7c-65.6 0-118.7-53.2-118.7-118.8S190.5 51.3 256.1 51.3c31.5 0 61.7 12.5 83.9 34.8 5.4 5.5 5.4 14.3 0 19.8l-64.2 64.2 64.2 64.2c5.4 5.5 5.4 14.3 0 19.7-22.3 22.3-52.5 34.8-84 34.7zm0-209.4c-50.1 0-90.8 40.7-90.8 90.8 0 50.1 40.7 90.8 90.8 90.8 19.2 0 38-6.1 53.5-17.5L246.1 180c-5.4-5.5-5.4-14.3 0-19.8l63.4-63.4C294 85.4 275.3 79.3 256 79.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 340.1" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/show.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M256 340.1c-58.1 0-120.5-28.2-180.4-81.6C31 218.9 3.6 179.7 2.5 178c-3.3-4.8-3.3-11.1 0-15.9 1.2-1.6 28.5-40.8 73.1-80.5C135.5 28.2 197.9 0 256 0c38.6 0 78.6 12.1 118.9 36C454 82.9 507.3 158.9 509.5 162.1c4.9 6 3.9 14.8-2.1 19.7-6 4.9-14.8 3.9-19.7-2.1-.4-.5-.8-1.1-1.2-1.7-.5-.7-52.2-74.3-125.9-118-35.8-21.3-71.1-32.1-104.6-32.1C148 27.9 55.2 139 31.4 170.1c23.9 31 116.8 142.1 224.6 142.1 64.2 0 122.8-40 160.7-73.5 5.4-5.5 14.3-5.6 19.8-.2 5.5 5.4 5.6 14.3.2 19.8-.5.5-.9.9-1.4 1.3-59.6 52.7-121.6 80.5-179.3 80.5z"></path><path class="lineal-fill" d="M330.1 96c-40.9-40.9-107.2-40.9-148.2 0s-40.9 107.2 0 148.2c40.9 40.9 107.2 40.9 148.1 0l-74-74.1L330.1 96z"></path><path class="lineal-stroke" d="M256 288.7c-65.6 0-118.7-53.2-118.7-118.8S190.5 51.3 256.1 51.3c31.5 0 61.7 12.5 83.9 34.8 5.4 5.5 5.4 14.3 0 19.8l-64.2 64.2 64.2 64.2c5.4 5.5 5.4 14.3 0 19.7-22.3 22.3-52.5 34.8-84 34.7zm0-209.4c-50.1 0-90.8 40.7-90.8 90.8 0 50.1 40.7 90.8 90.8 90.8 19.2 0 38-6.1 53.5-17.5L246.1 180c-5.4-5.5-5.4-14.3 0-19.8l63.4-63.4C294 85.4 275.3 79.3 256 79.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">show</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/show.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/show.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 408.2 392.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/sitemap.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M257.7 121.9H149c-14.5 0-26.2-11.8-26.2-26.2V39.5c0-14.5 11.7-26.2 26.2-26.2h108.7c14.5 0 26.2 11.7 26.3 26.2v56.3c0 14.4-11.7 26.1-26.3 26.1z"></path><path class="lineal-stroke" d="M259.1 132.4H150.5c-21 0-38.1-17.1-38.1-38.1V38.1c0-21 17.1-38.1 38.1-38.1h108.7c21 0 38.1 17.1 38.1 38.1v56.2c-.1 21-17.1 38-38.2 38.1zM150.5 23.7c-7.9 0-14.4 6.4-14.4 14.4v56.2c0 7.9 6.4 14.4 14.4 14.4h108.7c7.9 0 14.4-6.4 14.4-14.4V38.1c0-7.9-6.4-14.4-14.4-14.4H150.5zm54.3 318.4c-6.6 0-11.9-5.3-11.9-11.9V167.6c0-6.6 5.3-11.9 11.9-11.9s11.9 5.3 11.9 11.9v162.7c0 6.5-5.3 11.8-11.9 11.8zm147.4-71.9c-6.5 0-11.9-5.3-11.9-11.8v-33h-51.1c-6.5-.2-11.7-5.7-11.5-12.2.2-6.3 5.2-11.3 11.5-11.5H343c11.7 0 21.1 9.5 21.1 21.1v35.6c0 6.5-5.3 11.8-11.9 11.8z"></path><path class="lineal-stroke" d="M55.9 268.8c-6.6 0-11.9-5.3-11.9-11.9v-35.6c0-11.7 9.5-21.1 21.1-21.1h172.1c6.5.2 11.7 5.7 11.5 12.2-.2 6.3-5.2 11.3-11.5 11.5H67.8v33c0 6.5-5.3 11.8-11.9 11.9zm319 89.6h-45.2c-18.4 0-33.3-14.9-33.3-33.4v-45.2c0-18.4 14.9-33.3 33.3-33.3h45.2c18.4 0 33.3 14.9 33.3 33.3v22.3c-.2 6.5-5.7 11.7-12.2 11.5-6.3-.2-11.3-5.2-11.5-11.5v-22.3c0-5.3-4.3-9.6-9.6-9.6h-45.2c-5.3 0-9.6 4.3-9.6 9.6V325c0 5.3 4.3 9.6 9.6 9.6h45.2c6.5-.2 12 5 12.2 11.5.2 6.5-5 12-11.5 12.2-.3 0-.5 0-.7.1z"></path><path class="lineal-stroke" d="M78.6 356.9H33.3C14.9 356.9 0 342 0 323.6v-45.2C0 260 14.9 245.1 33.3 245h45.2c18.4 0 33.3 14.9 33.3 33.3v22.3c0 6.6-5.3 11.9-11.9 11.9S88 307.2 88 300.6v-22.3c0-5.3-4.3-9.6-9.6-9.6H33.3c-5.3 0-9.6 4.3-9.6 9.6v45.2c0 5.3 4.3 9.6 9.6 9.6h45.2c6.5.2 11.7 5.7 11.5 12.2-.1 6.4-5.2 11.4-11.4 11.6z"></path><path class="lineal-fill" d="M226 380.9h-45.2c-11.9 0-21.5-9.6-21.5-21.5v-45.2c0-11.9 9.6-21.5 21.5-21.5H226c11.9 0 21.5 9.6 21.5 21.5v45.2c0 11.8-9.6 21.5-21.5 21.5z"></path><path class="lineal-stroke" d="M226 392.7h-45.2c-18.4 0-33.3-14.9-33.3-33.3v-45.2c0-18.4 14.9-33.3 33.3-33.3H226c18.4 0 33.3 14.9 33.3 33.3v45.2c0 18.4-14.9 33.3-33.3 33.3zm-45.2-88.2c-5.3 0-9.6 4.3-9.6 9.6v45.2c0 5.3 4.3 9.6 9.6 9.6H226c5.3 0 9.6-4.3 9.6-9.6v-45.2c0-5.3-4.3-9.6-9.6-9.6h-45.2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 408.2 392.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/sitemap.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M257.7 121.9H149c-14.5 0-26.2-11.8-26.2-26.2V39.5c0-14.5 11.7-26.2 26.2-26.2h108.7c14.5 0 26.2 11.7 26.3 26.2v56.3c0 14.4-11.7 26.1-26.3 26.1z"></path><path class="lineal-stroke" d="M259.1 132.4H150.5c-21 0-38.1-17.1-38.1-38.1V38.1c0-21 17.1-38.1 38.1-38.1h108.7c21 0 38.1 17.1 38.1 38.1v56.2c-.1 21-17.1 38-38.2 38.1zM150.5 23.7c-7.9 0-14.4 6.4-14.4 14.4v56.2c0 7.9 6.4 14.4 14.4 14.4h108.7c7.9 0 14.4-6.4 14.4-14.4V38.1c0-7.9-6.4-14.4-14.4-14.4H150.5zm54.3 318.4c-6.6 0-11.9-5.3-11.9-11.9V167.6c0-6.6 5.3-11.9 11.9-11.9s11.9 5.3 11.9 11.9v162.7c0 6.5-5.3 11.8-11.9 11.8zm147.4-71.9c-6.5 0-11.9-5.3-11.9-11.8v-33h-51.1c-6.5-.2-11.7-5.7-11.5-12.2.2-6.3 5.2-11.3 11.5-11.5H343c11.7 0 21.1 9.5 21.1 21.1v35.6c0 6.5-5.3 11.8-11.9 11.8z"></path><path class="lineal-stroke" d="M55.9 268.8c-6.6 0-11.9-5.3-11.9-11.9v-35.6c0-11.7 9.5-21.1 21.1-21.1h172.1c6.5.2 11.7 5.7 11.5 12.2-.2 6.3-5.2 11.3-11.5 11.5H67.8v33c0 6.5-5.3 11.8-11.9 11.9zm319 89.6h-45.2c-18.4 0-33.3-14.9-33.3-33.4v-45.2c0-18.4 14.9-33.3 33.3-33.3h45.2c18.4 0 33.3 14.9 33.3 33.3v22.3c-.2 6.5-5.7 11.7-12.2 11.5-6.3-.2-11.3-5.2-11.5-11.5v-22.3c0-5.3-4.3-9.6-9.6-9.6h-45.2c-5.3 0-9.6 4.3-9.6 9.6V325c0 5.3 4.3 9.6 9.6 9.6h45.2c6.5-.2 12 5 12.2 11.5.2 6.5-5 12-11.5 12.2-.3 0-.5 0-.7.1z"></path><path class="lineal-stroke" d="M78.6 356.9H33.3C14.9 356.9 0 342 0 323.6v-45.2C0 260 14.9 245.1 33.3 245h45.2c18.4 0 33.3 14.9 33.3 33.3v22.3c0 6.6-5.3 11.9-11.9 11.9S88 307.2 88 300.6v-22.3c0-5.3-4.3-9.6-9.6-9.6H33.3c-5.3 0-9.6 4.3-9.6 9.6v45.2c0 5.3 4.3 9.6 9.6 9.6h45.2c6.5.2 11.7 5.7 11.5 12.2-.1 6.4-5.2 11.4-11.4 11.6z"></path><path class="lineal-fill" d="M226 380.9h-45.2c-11.9 0-21.5-9.6-21.5-21.5v-45.2c0-11.9 9.6-21.5 21.5-21.5H226c11.9 0 21.5 9.6 21.5 21.5v45.2c0 11.8-9.6 21.5-21.5 21.5z"></path><path class="lineal-stroke" d="M226 392.7h-45.2c-18.4 0-33.3-14.9-33.3-33.3v-45.2c0-18.4 14.9-33.3 33.3-33.3H226c18.4 0 33.3 14.9 33.3 33.3v45.2c0 18.4-14.9 33.3-33.3 33.3zm-45.2-88.2c-5.3 0-9.6 4.3-9.6 9.6v45.2c0 5.3 4.3 9.6 9.6 9.6H226c5.3 0 9.6-4.3 9.6-9.6v-45.2c0-5.3-4.3-9.6-9.6-9.6h-45.2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">sitemap</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/sitemap.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/sitemap.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 327.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M313.7 72.3V47c0-18.4-14.9-33.2-33.2-33.2H47c-18.4 0-33.2 14.9-33.2 33.2v25.3h299.9zM13.8 398.4V465c0 18.4 14.9 33.2 33.2 33.2h233.4c18.4 0 33.2-14.9 33.2-33.2v-66.6H13.8z"></path><path class="lineal-stroke" d="M280.4 0H47C21.1 0 0 21.1 0 47v418c0 25.9 21.1 47 47 47h233.4c25.9 0 47-21.1 47-47V352.3c0-7.6-6.2-13.8-13.8-13.7-7.6 0-13.7 6.2-13.7 13.7v32.3H27.5V86.1h272.4V256c0 7.6 6.1 13.8 13.7 13.8s13.8-6.1 13.8-13.7V47c0-25.9-21-47-47-47zm19.5 412.1V465c0 10.8-8.7 19.5-19.5 19.5H47c-10.8 0-19.5-8.7-19.5-19.5v-52.9h272.4zM27.5 58.6V47c0-10.8 8.7-19.5 19.5-19.5h233.4c10.8 0 19.5 8.7 19.5 19.5v11.6H27.5z"></path><circle cx="163.7" cy="448.3" r="9.4"></circle><path class="lineal-stroke" d="M163.7 471.5c-12.8 0-23.2-10.4-23.2-23.2 0-12.8 10.4-23.2 23.2-23.2s23.2 10.4 23.2 23.2-10.4 23.2-23.2 23.2zm-25.4-248.1H69.5c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.8 6.2 13.8 13.8s-6.2 13.8-13.8 13.8h-55v32.1h55c7.6 0 13.8 6.2 13.8 13.8-.1 7.5-6.2 13.7-13.8 13.7z"></path><path class="lineal-fill" d="M189.2 150H258v59.6h-68.8z"></path><path class="lineal-stroke" d="M258 223.4h-68.8c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.6-6.1 13.8-13.7 13.8zm-55-27.5h41.3v-32.1h-41.4l.1 32.1z"></path><path class="lineal-fill" d="M69.5 265.6h68.8v59.6H69.5z"></path><path class="lineal-stroke" d="M138.3 339H69.5c-7.6 0-13.8-6.2-13.8-13.8v-59.7c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.7-6.1 13.9-13.7 13.9zm-55-27.5h41.2v-32.1H83.2l.1 32.1zM258 339h-68.8c-7.6 0-13.8-6.2-13.7-13.8 0-7.6 6.2-13.7 13.7-13.7h55v-32.1h-55c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.8 6.2 13.8 13.8v59.6c0 7.6-6.2 13.8-13.8 13.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 327.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M313.7 72.3V47c0-18.4-14.9-33.2-33.2-33.2H47c-18.4 0-33.2 14.9-33.2 33.2v25.3h299.9zM13.8 398.4V465c0 18.4 14.9 33.2 33.2 33.2h233.4c18.4 0 33.2-14.9 33.2-33.2v-66.6H13.8z"></path><path class="lineal-stroke" d="M280.4 0H47C21.1 0 0 21.1 0 47v418c0 25.9 21.1 47 47 47h233.4c25.9 0 47-21.1 47-47V352.3c0-7.6-6.2-13.8-13.8-13.7-7.6 0-13.7 6.2-13.7 13.7v32.3H27.5V86.1h272.4V256c0 7.6 6.1 13.8 13.7 13.8s13.8-6.1 13.8-13.7V47c0-25.9-21-47-47-47zm19.5 412.1V465c0 10.8-8.7 19.5-19.5 19.5H47c-10.8 0-19.5-8.7-19.5-19.5v-52.9h272.4zM27.5 58.6V47c0-10.8 8.7-19.5 19.5-19.5h233.4c10.8 0 19.5 8.7 19.5 19.5v11.6H27.5z"></path><circle cx="163.7" cy="448.3" r="9.4"></circle><path class="lineal-stroke" d="M163.7 471.5c-12.8 0-23.2-10.4-23.2-23.2 0-12.8 10.4-23.2 23.2-23.2s23.2 10.4 23.2 23.2-10.4 23.2-23.2 23.2zm-25.4-248.1H69.5c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.8 6.2 13.8 13.8s-6.2 13.8-13.8 13.8h-55v32.1h55c7.6 0 13.8 6.2 13.8 13.8-.1 7.5-6.2 13.7-13.8 13.7z"></path><path class="lineal-fill" d="M189.2 150H258v59.6h-68.8z"></path><path class="lineal-stroke" d="M258 223.4h-68.8c-7.6 0-13.8-6.2-13.8-13.8V150c0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.6-6.1 13.8-13.7 13.8zm-55-27.5h41.3v-32.1h-41.4l.1 32.1z"></path><path class="lineal-fill" d="M69.5 265.6h68.8v59.6H69.5z"></path><path class="lineal-stroke" d="M138.3 339H69.5c-7.6 0-13.8-6.2-13.8-13.8v-59.7c0-7.6 6.2-13.8 13.8-13.8h68.8c7.6 0 13.7 6.2 13.7 13.8v59.6c0 7.7-6.1 13.9-13.7 13.9zm-55-27.5h41.2v-32.1H83.2l.1 32.1zM258 339h-68.8c-7.6 0-13.8-6.2-13.7-13.8 0-7.6 6.2-13.7 13.7-13.7h55v-32.1h-55c-7.6 0-13.8-6.2-13.8-13.8 0-7.6 6.2-13.8 13.8-13.8H258c7.6 0 13.8 6.2 13.8 13.8v59.6c0 7.6-6.2 13.8-13.8 13.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">smartphone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 306.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M11.1 348.5c-6.1 0-11.1-5-11.1-11.1V72.2C0 66 5 61.1 11.1 61.1h284.5c6.1 0 11.1 5 11.1 11.1V257c0 6.1-5 11.1-11.1 11.1s-11.1-5-11.1-11.1V83.2H22.2v254.2c0 6.2-5 11.2-11.1 11.1 0 .1 0 .1 0 0z"></path><path class="lineal-fill" d="M48.8 398.5H258c20.8 0 37.7-16.9 37.7-37.7v-23.4H11.1v23.4c0 20.8 16.9 37.7 37.7 37.7z"></path><path class="lineal-stroke" d="M258 409.6H48.8C21.9 409.6 0 387.7 0 360.8v-23.4c0-6.1 5-11.1 11.1-11.1h284.5c6.1 0 11.1 5 11.1 11.1v23.4c0 26.9-21.8 48.7-48.7 48.8zM22.2 348.5v12.3c0 14.7 11.9 26.6 26.6 26.6H258c14.7 0 26.6-11.9 26.6-26.6v-12.3H22.2zM295.6 83.2H11.1C5 83.2 0 78.3 0 72.2V48.8C0 21.9 21.9 0 48.8 0H258c26.9 0 48.8 21.9 48.8 48.8v23.4c0 6.1-5 11-11.2 11zM22.2 61h262.3V48.8c0-14.7-11.9-26.5-26.5-26.6H48.8c-14.7 0-26.6 11.9-26.6 26.6V61z"></path><path class="st2" d="M65.1 130.8L85 145.3l23.3-28.9"></path><path class="lineal-stroke" d="M85 156.4c-2.3 0-4.6-.7-6.5-2.1l-20-14.4c-5-3.6-6.1-10.5-2.5-15.5s10.5-6.1 15.5-2.5l11.5 8.3 16.7-20.7c3.9-4.8 10.9-5.5 15.6-1.6s5.5 10.9 1.6 15.6l-23.3 28.8c-2 2.6-5.2 4.1-8.6 4.1zM241.7 142H159c-6.1-.2-11-5.3-10.8-11.4.2-5.9 4.9-10.6 10.8-10.8h82.7c6.1.2 11 5.3 10.8 11.4-.2 5.9-4.9 10.6-10.8 10.8z"></path><path class="st2" d="M65.1 204.8L85 219.2l23.3-28.8"></path><path class="lineal-stroke" d="M85 230.3c-2.3 0-4.6-.7-6.5-2.1l-20-14.4c-5-3.6-6.1-10.5-2.5-15.5s10.5-6.1 15.5-2.5l11.5 8.3 16.7-20.7c3.8-4.8 10.8-5.5 15.6-1.7s5.5 10.8 1.7 15.6l-23.3 28.9c-2.1 2.6-5.3 4.1-8.7 4.1zm156.7-14.4H159c-6.1 0-11.1-5-11.1-11.1s5-11.1 11.1-11.1h82.7c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1z"></path><path class="st2" d="M65.1 278.8L85 293.2l23.3-28.9"></path><path class="lineal-stroke" d="M85 304.3c-2.3 0-4.6-.7-6.5-2.1l-20-14.4c-5-3.6-6.1-10.5-2.5-15.5s10.5-6.1 15.5-2.5L83 278l16.7-20.7c3.9-4.8 10.9-5.5 15.6-1.7s5.5 10.9 1.7 15.6l-23.3 28.9c-2.1 2.7-5.3 4.2-8.7 4.2zm156.7-14.4H159c-6.1 0-11.1-5-11.1-11.1s5-11.1 11.1-11.1h82.7c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 306.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M11.1 348.5c-6.1 0-11.1-5-11.1-11.1V72.2C0 66 5 61.1 11.1 61.1h284.5c6.1 0 11.1 5 11.1 11.1V257c0 6.1-5 11.1-11.1 11.1s-11.1-5-11.1-11.1V83.2H22.2v254.2c0 6.2-5 11.2-11.1 11.1 0 .1 0 .1 0 0z"></path><path class="lineal-fill" d="M48.8 398.5H258c20.8 0 37.7-16.9 37.7-37.7v-23.4H11.1v23.4c0 20.8 16.9 37.7 37.7 37.7z"></path><path class="lineal-stroke" d="M258 409.6H48.8C21.9 409.6 0 387.7 0 360.8v-23.4c0-6.1 5-11.1 11.1-11.1h284.5c6.1 0 11.1 5 11.1 11.1v23.4c0 26.9-21.8 48.7-48.7 48.8zM22.2 348.5v12.3c0 14.7 11.9 26.6 26.6 26.6H258c14.7 0 26.6-11.9 26.6-26.6v-12.3H22.2zM295.6 83.2H11.1C5 83.2 0 78.3 0 72.2V48.8C0 21.9 21.9 0 48.8 0H258c26.9 0 48.8 21.9 48.8 48.8v23.4c0 6.1-5 11-11.2 11zM22.2 61h262.3V48.8c0-14.7-11.9-26.5-26.5-26.6H48.8c-14.7 0-26.6 11.9-26.6 26.6V61z"></path><path class="st2" d="M65.1 130.8L85 145.3l23.3-28.9"></path><path class="lineal-stroke" d="M85 156.4c-2.3 0-4.6-.7-6.5-2.1l-20-14.4c-5-3.6-6.1-10.5-2.5-15.5s10.5-6.1 15.5-2.5l11.5 8.3 16.7-20.7c3.9-4.8 10.9-5.5 15.6-1.6s5.5 10.9 1.6 15.6l-23.3 28.8c-2 2.6-5.2 4.1-8.6 4.1zM241.7 142H159c-6.1-.2-11-5.3-10.8-11.4.2-5.9 4.9-10.6 10.8-10.8h82.7c6.1.2 11 5.3 10.8 11.4-.2 5.9-4.9 10.6-10.8 10.8z"></path><path class="st2" d="M65.1 204.8L85 219.2l23.3-28.8"></path><path class="lineal-stroke" d="M85 230.3c-2.3 0-4.6-.7-6.5-2.1l-20-14.4c-5-3.6-6.1-10.5-2.5-15.5s10.5-6.1 15.5-2.5l11.5 8.3 16.7-20.7c3.8-4.8 10.8-5.5 15.6-1.7s5.5 10.8 1.7 15.6l-23.3 28.9c-2.1 2.6-5.3 4.1-8.7 4.1zm156.7-14.4H159c-6.1 0-11.1-5-11.1-11.1s5-11.1 11.1-11.1h82.7c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1z"></path><path class="st2" d="M65.1 278.8L85 293.2l23.3-28.9"></path><path class="lineal-stroke" d="M85 304.3c-2.3 0-4.6-.7-6.5-2.1l-20-14.4c-5-3.6-6.1-10.5-2.5-15.5s10.5-6.1 15.5-2.5L83 278l16.7-20.7c3.9-4.8 10.9-5.5 15.6-1.7s5.5 10.9 1.7 15.6l-23.3 28.9c-2.1 2.7-5.3 4.2-8.7 4.2zm156.7-14.4H159c-6.1 0-11.1-5-11.1-11.1s5-11.1 11.1-11.1h82.7c6.1 0 11.1 5 11.1 11.1s-5 11.1-11.1 11.1z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">smartphone-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 334.88 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M153.66 39.88H40.37A29.34 29.34 0 0011 69.22v34.6h139.25"></path><path class="lineal-stroke" d="M150.25 114.85H11a11 11 0 01-11-11V69.22a40.42 40.42 0 0140.37-40.37h113.29a11 11 0 010 22H40.37a18.34 18.34 0 00-18.32 18.37V92.8h128.2a11 11 0 010 22z"></path><path class="lineal-fill" d="M11 329.92v39.31a29.34 29.34 0 0029.35 29.34h166.47a29.33 29.33 0 0029.34-29.34v-39.31H90.56"></path><path class="lineal-stroke" d="M206.82 409.6H40.37A40.42 40.42 0 010 369.23v-39.31a11 11 0 0122.05 0v39.31a18.34 18.34 0 0018.32 18.32h166.45a18.34 18.34 0 0018.32-18.32V341H90.56a11 11 0 010-22.05h145.6a11 11 0 0111 11v39.31a40.42 40.42 0 01-40.37 40.37z"></path><path class="lineal-stroke" d="M141 375.1h-33.91a11 11 0 010-22.05H141a11 11 0 010 22.05zM11 344.37a11 11 0 01-11-11V94.74a11 11 0 0122.05 0v238.61a11 11 0 01-11 11zm225.16 9.73a11 11 0 01-11-11v-68.94a11 11 0 0122.05 0v68.92a11 11 0 01-11 11zm1.44-111.91a25 25 0 01-10.6-2.32c-26.07-12-86.71-44.42-86.71-86.33V43.91a15.05 15.05 0 0115.33-15.1 17.3 17.3 0 015.15.81 43.09 43.09 0 0013.65 2.13 44.13 44.13 0 0038-21.4A21.6 21.6 0 01230.77 0h13.66a21.62 21.62 0 0118.34 10.35 44.13 44.13 0 0038 21.4 44.38 44.38 0 0014.12-2.29 15.18 15.18 0 0120 14.44v109.64c0 41.91-60.65 74.34-86.72 86.33a25 25 0 01-10.56 2.32zM162.38 52.72v100.82c0 23.85 39.79 50.62 73.87 66.3a3.26 3.26 0 002.7 0c34.08-15.68 73.88-42.45 73.88-66.3V52.7a66.77 66.77 0 01-12.08 1.1 66 66 0 01-56.68-31.75h-12.94a66 66 0 01-56.67 31.75 64.33 64.33 0 01-12.08-1.08z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 334.88 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M153.66 39.88H40.37A29.34 29.34 0 0011 69.22v34.6h139.25"></path><path class="lineal-stroke" d="M150.25 114.85H11a11 11 0 01-11-11V69.22a40.42 40.42 0 0140.37-40.37h113.29a11 11 0 010 22H40.37a18.34 18.34 0 00-18.32 18.37V92.8h128.2a11 11 0 010 22z"></path><path class="lineal-fill" d="M11 329.92v39.31a29.34 29.34 0 0029.35 29.34h166.47a29.33 29.33 0 0029.34-29.34v-39.31H90.56"></path><path class="lineal-stroke" d="M206.82 409.6H40.37A40.42 40.42 0 010 369.23v-39.31a11 11 0 0122.05 0v39.31a18.34 18.34 0 0018.32 18.32h166.45a18.34 18.34 0 0018.32-18.32V341H90.56a11 11 0 010-22.05h145.6a11 11 0 0111 11v39.31a40.42 40.42 0 01-40.37 40.37z"></path><path class="lineal-stroke" d="M141 375.1h-33.91a11 11 0 010-22.05H141a11 11 0 010 22.05zM11 344.37a11 11 0 01-11-11V94.74a11 11 0 0122.05 0v238.61a11 11 0 01-11 11zm225.16 9.73a11 11 0 01-11-11v-68.94a11 11 0 0122.05 0v68.92a11 11 0 01-11 11zm1.44-111.91a25 25 0 01-10.6-2.32c-26.07-12-86.71-44.42-86.71-86.33V43.91a15.05 15.05 0 0115.33-15.1 17.3 17.3 0 015.15.81 43.09 43.09 0 0013.65 2.13 44.13 44.13 0 0038-21.4A21.6 21.6 0 01230.77 0h13.66a21.62 21.62 0 0118.34 10.35 44.13 44.13 0 0038 21.4 44.38 44.38 0 0014.12-2.29 15.18 15.18 0 0120 14.44v109.64c0 41.91-60.65 74.34-86.72 86.33a25 25 0 01-10.56 2.32zM162.38 52.72v100.82c0 23.85 39.79 50.62 73.87 66.3a3.26 3.26 0 002.7 0c34.08-15.68 73.88-42.45 73.88-66.3V52.7a66.77 66.77 0 01-12.08 1.1 66 66 0 01-56.68-31.75h-12.94a66 66 0 01-56.67 31.75 64.33 64.33 0 01-12.08-1.08z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">smartphone-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 328.98 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone-4.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M10.66 339A10.66 10.66 0 010 328.33V42.42A42.47 42.47 0 0142.42 0H222.6A42.47 42.47 0 01265 42.42v13.85a10.66 10.66 0 11-21.32 0V42.42a21.12 21.12 0 00-21.1-21.1H42.42a21.13 21.13 0 00-21.1 21.1v285.91A10.66 10.66 0 0110.66 339z"></path><path class="lineal-fill" d="M10.66 324.63v42.55a31.76 31.76 0 0031.76 31.76H222.6a31.77 31.77 0 0031.77-31.76v-42.55H10.66"></path><path class="lineal-stroke" d="M222.6 409.6H42.42A42.47 42.47 0 010 367.18v-42.55A10.66 10.66 0 0110.66 314h243.71A10.66 10.66 0 01265 324.63v42.55a42.47 42.47 0 01-42.4 42.42zM21.32 335.28v31.9a21.13 21.13 0 0021.1 21.1H222.6a21.13 21.13 0 0021.11-21.1v-31.9z"></path><path class="lineal-stroke" d="M151.35 372.25h-36.7a10.66 10.66 0 010-21.32h36.7a10.66 10.66 0 110 21.32zm103.02-22.72a10.66 10.66 0 01-10.66-10.66v-39.56a10.66 10.66 0 0121.32 0v39.56a10.67 10.67 0 01-10.66 10.66z"></path><path class="lineal-fill" d="M304.8 261.7H203.93a13.52 13.52 0 01-13.52-13.52v-79.61a13.52 13.52 0 0113.52-13.52H304.8a13.52 13.52 0 0113.52 13.52v79.61a13.52 13.52 0 01-13.52 13.52z"></path><path class="lineal-stroke" d="M304.8 272.36H203.93a24.2 24.2 0 01-24.18-24.18v-79.61a24.2 24.2 0 0124.18-24.18H304.8a24.2 24.2 0 0124.2 24.18v79.61a24.2 24.2 0 01-24.18 24.18zM203.93 165.71a2.87 2.87 0 00-2.86 2.86v79.61a2.86 2.86 0 002.86 2.86H304.8a2.86 2.86 0 002.86-2.86v-79.61a2.87 2.87 0 00-2.86-2.86z"></path><path class="lineal-stroke" d="M207.07 165.71a10.66 10.66 0 01-10.66-10.66v-43.2A28.59 28.59 0 01225 83.3h58.8a28.59 28.59 0 0128.55 28.55v2a10.66 10.66 0 11-21.32 0v-2a7.24 7.24 0 00-7.23-7.23H225a7.24 7.24 0 00-7.23 7.23v43.2a10.66 10.66 0 01-10.66 10.66zm47.3 60.29a10.66 10.66 0 01-10.66-10.66v-16.86a10.66 10.66 0 1121.32 0v16.83A10.67 10.67 0 01254.37 226z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 328.98 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartphone-4.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M10.66 339A10.66 10.66 0 010 328.33V42.42A42.47 42.47 0 0142.42 0H222.6A42.47 42.47 0 01265 42.42v13.85a10.66 10.66 0 11-21.32 0V42.42a21.12 21.12 0 00-21.1-21.1H42.42a21.13 21.13 0 00-21.1 21.1v285.91A10.66 10.66 0 0110.66 339z"></path><path class="lineal-fill" d="M10.66 324.63v42.55a31.76 31.76 0 0031.76 31.76H222.6a31.77 31.77 0 0031.77-31.76v-42.55H10.66"></path><path class="lineal-stroke" d="M222.6 409.6H42.42A42.47 42.47 0 010 367.18v-42.55A10.66 10.66 0 0110.66 314h243.71A10.66 10.66 0 01265 324.63v42.55a42.47 42.47 0 01-42.4 42.42zM21.32 335.28v31.9a21.13 21.13 0 0021.1 21.1H222.6a21.13 21.13 0 0021.11-21.1v-31.9z"></path><path class="lineal-stroke" d="M151.35 372.25h-36.7a10.66 10.66 0 010-21.32h36.7a10.66 10.66 0 110 21.32zm103.02-22.72a10.66 10.66 0 01-10.66-10.66v-39.56a10.66 10.66 0 0121.32 0v39.56a10.67 10.67 0 01-10.66 10.66z"></path><path class="lineal-fill" d="M304.8 261.7H203.93a13.52 13.52 0 01-13.52-13.52v-79.61a13.52 13.52 0 0113.52-13.52H304.8a13.52 13.52 0 0113.52 13.52v79.61a13.52 13.52 0 01-13.52 13.52z"></path><path class="lineal-stroke" d="M304.8 272.36H203.93a24.2 24.2 0 01-24.18-24.18v-79.61a24.2 24.2 0 0124.18-24.18H304.8a24.2 24.2 0 0124.2 24.18v79.61a24.2 24.2 0 01-24.18 24.18zM203.93 165.71a2.87 2.87 0 00-2.86 2.86v79.61a2.86 2.86 0 002.86 2.86H304.8a2.86 2.86 0 002.86-2.86v-79.61a2.87 2.87 0 00-2.86-2.86z"></path><path class="lineal-stroke" d="M207.07 165.71a10.66 10.66 0 01-10.66-10.66v-43.2A28.59 28.59 0 01225 83.3h58.8a28.59 28.59 0 0128.55 28.55v2a10.66 10.66 0 11-21.32 0v-2a7.24 7.24 0 00-7.23-7.23H225a7.24 7.24 0 00-7.23 7.23v43.2a10.66 10.66 0 01-10.66 10.66zm47.3 60.29a10.66 10.66 0 01-10.66-10.66v-16.86a10.66 10.66 0 1121.32 0v16.83A10.67 10.67 0 01254.37 226z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">smartphone-4</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone-4.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartphone-4.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 237.37 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartwatch.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M37.69 95.93l18.4-72.48A17 17 0 0172.68 10.8h92a17 17 0 0116.59 12.65l18.39 72.48"></path><path class="lineal-stroke" d="M199.67 106.73a10.81 10.81 0 01-10.46-8.15L170.82 26.1a6.19 6.19 0 00-6.12-4.5h-92a6.2 6.2 0 00-6.13 4.5L48.16 98.58a10.8 10.8 0 11-20.93-5.31l18.39-72.48A27.76 27.76 0 0172.68 0h92a27.78 27.78 0 0127.06 20.79l18.39 72.48a10.8 10.8 0 01-7.81 13.12 10.68 10.68 0 01-2.67.34z"></path><path class="lineal-stroke" d="M191 324H46.34A46.4 46.4 0 010 277.7V131.9a46.4 46.4 0 0146.34-46.34H191a46.39 46.39 0 0146.34 46.34v145.8A46.39 46.39 0 01191 324zM46.34 107.16A24.76 24.76 0 0021.6 131.9v145.8a24.77 24.77 0 0024.74 24.75H191a24.78 24.78 0 0024.75-24.75V131.9A24.77 24.77 0 00191 107.16z"></path><path class="lineal-fill" d="M191 313.24H46.34a36.16 36.16 0 01-7-.68l16.96 73.25A17 17 0 0073 398.8h91.44a17 17 0 0016.67-13L198 312.56a36.26 36.26 0 01-7 .68z"></path><path class="lineal-stroke" d="M164.41 409.6H73a27.66 27.66 0 01-27.2-21.36L28.87 315a10.79 10.79 0 0112.62-13 25.55 25.55 0 004.85.47H191a25.47 25.47 0 004.85-.47 10.79 10.79 0 0112.62 13l-16.9 73.25a27.64 27.64 0 01-27.19 21.36zM53.12 324l13.7 59.34A6.23 6.23 0 0073 388h91.44a6.24 6.24 0 006.15-4.62L184.25 324zM39.65 202.16L75.31 179a4.27 4.27 0 012.67-.7c4.21 0 9.55 4.49 9.55 10.25A6.44 6.44 0 0185 194l-24.71 16L85 226a6.44 6.44 0 012.53 5.48c0 5.75-5.34 10.24-9.55 10.24a4.33 4.33 0 01-2.67-.69l-35.66-23.14a9.29 9.29 0 010-15.73zM152.1 148a6.08 6.08 0 01-.56 2.67l-49.42 101.19c-1 2.11-3.65 3.51-6.32 3.51a7.77 7.77 0 01-7.86-7.44 6.28 6.28 0 01.7-2.66L137.92 144a6.19 6.19 0 015.9-3.5c3.93 0 8.28 2.94 8.28 7.43zm48.29 69.89l-35.66 23.17a4.23 4.23 0 01-2.66.7c-4.22 0-9.55-4.49-9.55-10.25a6.43 6.43 0 012.53-5.48l24.71-16-24.71-16a6.41 6.41 0 01-2.53-5.47c0-5.76 5.33-10.25 9.55-10.25a4.23 4.23 0 012.66.7l35.66 23.17a9.26 9.26 0 010 15.72z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 237.37 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/smartwatch.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M37.69 95.93l18.4-72.48A17 17 0 0172.68 10.8h92a17 17 0 0116.59 12.65l18.39 72.48"></path><path class="lineal-stroke" d="M199.67 106.73a10.81 10.81 0 01-10.46-8.15L170.82 26.1a6.19 6.19 0 00-6.12-4.5h-92a6.2 6.2 0 00-6.13 4.5L48.16 98.58a10.8 10.8 0 11-20.93-5.31l18.39-72.48A27.76 27.76 0 0172.68 0h92a27.78 27.78 0 0127.06 20.79l18.39 72.48a10.8 10.8 0 01-7.81 13.12 10.68 10.68 0 01-2.67.34z"></path><path class="lineal-stroke" d="M191 324H46.34A46.4 46.4 0 010 277.7V131.9a46.4 46.4 0 0146.34-46.34H191a46.39 46.39 0 0146.34 46.34v145.8A46.39 46.39 0 01191 324zM46.34 107.16A24.76 24.76 0 0021.6 131.9v145.8a24.77 24.77 0 0024.74 24.75H191a24.78 24.78 0 0024.75-24.75V131.9A24.77 24.77 0 00191 107.16z"></path><path class="lineal-fill" d="M191 313.24H46.34a36.16 36.16 0 01-7-.68l16.96 73.25A17 17 0 0073 398.8h91.44a17 17 0 0016.67-13L198 312.56a36.26 36.26 0 01-7 .68z"></path><path class="lineal-stroke" d="M164.41 409.6H73a27.66 27.66 0 01-27.2-21.36L28.87 315a10.79 10.79 0 0112.62-13 25.55 25.55 0 004.85.47H191a25.47 25.47 0 004.85-.47 10.79 10.79 0 0112.62 13l-16.9 73.25a27.64 27.64 0 01-27.19 21.36zM53.12 324l13.7 59.34A6.23 6.23 0 0073 388h91.44a6.24 6.24 0 006.15-4.62L184.25 324zM39.65 202.16L75.31 179a4.27 4.27 0 012.67-.7c4.21 0 9.55 4.49 9.55 10.25A6.44 6.44 0 0185 194l-24.71 16L85 226a6.44 6.44 0 012.53 5.48c0 5.75-5.34 10.24-9.55 10.24a4.33 4.33 0 01-2.67-.69l-35.66-23.14a9.29 9.29 0 010-15.73zM152.1 148a6.08 6.08 0 01-.56 2.67l-49.42 101.19c-1 2.11-3.65 3.51-6.32 3.51a7.77 7.77 0 01-7.86-7.44 6.28 6.28 0 01.7-2.66L137.92 144a6.19 6.19 0 015.9-3.5c3.93 0 8.28 2.94 8.28 7.43zm48.29 69.89l-35.66 23.17a4.23 4.23 0 01-2.66.7c-4.22 0-9.55-4.49-9.55-10.25a6.43 6.43 0 012.53-5.48l24.71-16-24.71-16a6.41 6.41 0 01-2.53-5.47c0-5.76 5.33-10.25 9.55-10.25a4.23 4.23 0 012.66.7l35.66 23.17a9.26 9.26 0 010 15.72z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">smartwatch</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartwatch.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/smartwatch.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/speedometer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M233.2 420.7l37.7-37.6 18.1 18 21.9-97.2-97.3 21.9 18.1 18-57.1 57.2"></path><path class="lineal-stroke" d="M233.2 435.2c-8 0-14.5-6.5-14.5-14.4 0-3.8 1.5-7.5 4.2-10.2l37.7-37.7c5.5-5.5 14.3-5.7 20-.4l11.1-49.4-49.4 11.1c5.2 5.7 5 14.5-.4 20l-57.1 57.1c-5.6 5.6-14.8 5.6-20.4 0-5.6-5.6-5.6-14.8 0-20.4l46.9-46.9-7.9-7.9c-5.6-5.6-5.6-14.8 0-20.4 1.9-1.9 4.4-3.3 7-3.9l97.3-21.9c7.8-1.8 15.5 3.1 17.3 10.9.5 2.1.5 4.3 0 6.4l-21.9 97.3c-1.8 7.8-9.5 12.6-17.3 10.9-2.7-.6-5.1-1.9-7-3.9l-7.9-7.9-27.4 27.5c-2.7 2.5-6.4 4.1-10.3 4.1z"></path><path class="lineal-stroke" d="M256 512C114.8 512 0 397.2 0 256S114.8 0 256 0c52.8-.1 104.2 16.2 147.3 46.6 6.5 4.6 8.1 13.6 3.5 20.1s-13.6 8.1-20.1 3.5c-38.2-27-83.9-41.5-130.7-41.3C130.8 28.9 28.9 130.8 28.9 256S130.8 483.1 256 483.1 483.1 381.2 483.1 256c.1-34-7.5-67.6-22.3-98.3-3.7-7-1.1-15.8 6-19.5s15.8-1.1 19.5 6c.2.3.3.7.5 1 16.7 34.6 25.3 72.4 25.2 110.8 0 141.2-114.8 256-256 256z"></path><path class="lineal-stroke" d="M230.7 434.8c-.7 0-1.5-.1-2.2-.2C140.4 421 75.4 345.2 75.2 256c0-99.7 81.1-180.8 180.8-180.8S436.8 156.3 436.8 256c-.2 8-6.8 14.3-14.8 14.1-7.7-.2-13.9-6.4-14.1-14.1 0-83.7-68.1-151.9-151.9-151.9S104.1 172.3 104.1 256c0 74.3 55.3 138.9 128.8 150.1 7.9 1.2 13.3 8.5 12.1 16.4-1 7.1-7.1 12.3-14.3 12.3z"></path><path class="lineal-fill" d="M256 165c50.2.1 91 40.8 91 91h75.3c0-91.7-74.6-166.3-166.3-166.3S89.7 164.3 89.7 256H165c.1-50.2 40.8-90.9 91-91z"></path><path class="lineal-stroke" d="M422.3 270.4H347c-8 0-14.4-6.5-14.4-14.4 0-42.3-34.3-76.6-76.6-76.6s-76.6 34.3-76.6 76.6c0 8-6.4 14.4-14.4 14.4H89.7c-8 0-14.4-6.5-14.4-14.4 0-99.7 81.1-180.8 180.8-180.8 99.3 0 180.2 80.6 180.7 179.8v1c-.1 8-6.5 14.4-14.5 14.4zm-61.8-28.8h46.7c-7.3-77-72.3-137.4-151.2-137.4s-143.9 60.4-151.2 137.4h46.7c8-57.7 61.3-98 119-90 46.7 6.4 83.5 43.2 90 90z"></path><path class="lineal-stroke" d="M216.3 187.3c-3.4 0-6.6-1.2-9.2-3.3l-59.8-49.4c-6.1-5.1-7-14.2-1.9-20.3 5.1-6.1 14.2-7 20.3-1.9l59.8 49.4c6.2 5.1 7 14.2 2 20.3-2.8 3.3-6.9 5.2-11.2 5.2zm79.4 0c-8 0-14.4-6.4-14.5-14.4 0-4.3 1.9-8.4 5.3-11.2l59.8-49.4c6.1-5.1 15.3-4.2 20.3 1.9 5.1 6.1 4.2 15.3-1.9 20.3L304.9 184c-2.6 2.1-5.8 3.3-9.2 3.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/speedometer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M233.2 420.7l37.7-37.6 18.1 18 21.9-97.2-97.3 21.9 18.1 18-57.1 57.2"></path><path class="lineal-stroke" d="M233.2 435.2c-8 0-14.5-6.5-14.5-14.4 0-3.8 1.5-7.5 4.2-10.2l37.7-37.7c5.5-5.5 14.3-5.7 20-.4l11.1-49.4-49.4 11.1c5.2 5.7 5 14.5-.4 20l-57.1 57.1c-5.6 5.6-14.8 5.6-20.4 0-5.6-5.6-5.6-14.8 0-20.4l46.9-46.9-7.9-7.9c-5.6-5.6-5.6-14.8 0-20.4 1.9-1.9 4.4-3.3 7-3.9l97.3-21.9c7.8-1.8 15.5 3.1 17.3 10.9.5 2.1.5 4.3 0 6.4l-21.9 97.3c-1.8 7.8-9.5 12.6-17.3 10.9-2.7-.6-5.1-1.9-7-3.9l-7.9-7.9-27.4 27.5c-2.7 2.5-6.4 4.1-10.3 4.1z"></path><path class="lineal-stroke" d="M256 512C114.8 512 0 397.2 0 256S114.8 0 256 0c52.8-.1 104.2 16.2 147.3 46.6 6.5 4.6 8.1 13.6 3.5 20.1s-13.6 8.1-20.1 3.5c-38.2-27-83.9-41.5-130.7-41.3C130.8 28.9 28.9 130.8 28.9 256S130.8 483.1 256 483.1 483.1 381.2 483.1 256c.1-34-7.5-67.6-22.3-98.3-3.7-7-1.1-15.8 6-19.5s15.8-1.1 19.5 6c.2.3.3.7.5 1 16.7 34.6 25.3 72.4 25.2 110.8 0 141.2-114.8 256-256 256z"></path><path class="lineal-stroke" d="M230.7 434.8c-.7 0-1.5-.1-2.2-.2C140.4 421 75.4 345.2 75.2 256c0-99.7 81.1-180.8 180.8-180.8S436.8 156.3 436.8 256c-.2 8-6.8 14.3-14.8 14.1-7.7-.2-13.9-6.4-14.1-14.1 0-83.7-68.1-151.9-151.9-151.9S104.1 172.3 104.1 256c0 74.3 55.3 138.9 128.8 150.1 7.9 1.2 13.3 8.5 12.1 16.4-1 7.1-7.1 12.3-14.3 12.3z"></path><path class="lineal-fill" d="M256 165c50.2.1 91 40.8 91 91h75.3c0-91.7-74.6-166.3-166.3-166.3S89.7 164.3 89.7 256H165c.1-50.2 40.8-90.9 91-91z"></path><path class="lineal-stroke" d="M422.3 270.4H347c-8 0-14.4-6.5-14.4-14.4 0-42.3-34.3-76.6-76.6-76.6s-76.6 34.3-76.6 76.6c0 8-6.4 14.4-14.4 14.4H89.7c-8 0-14.4-6.5-14.4-14.4 0-99.7 81.1-180.8 180.8-180.8 99.3 0 180.2 80.6 180.7 179.8v1c-.1 8-6.5 14.4-14.5 14.4zm-61.8-28.8h46.7c-7.3-77-72.3-137.4-151.2-137.4s-143.9 60.4-151.2 137.4h46.7c8-57.7 61.3-98 119-90 46.7 6.4 83.5 43.2 90 90z"></path><path class="lineal-stroke" d="M216.3 187.3c-3.4 0-6.6-1.2-9.2-3.3l-59.8-49.4c-6.1-5.1-7-14.2-1.9-20.3 5.1-6.1 14.2-7 20.3-1.9l59.8 49.4c6.2 5.1 7 14.2 2 20.3-2.8 3.3-6.9 5.2-11.2 5.2zm79.4 0c-8 0-14.4-6.4-14.5-14.4 0-4.3 1.9-8.4 5.3-11.2l59.8-49.4c6.1-5.1 15.3-4.2 20.3 1.9 5.1 6.1 4.2 15.3-1.9 20.3L304.9 184c-2.6 2.1-5.8 3.3-9.2 3.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">speedometer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/speedometer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/speedometer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/square.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M226.2 350.7H69.8c-6 0-10.8-4.9-10.8-10.9V183.4c-.2-6 4.5-11 10.5-11.2s11 4.5 11.2 10.5V329h145.5c6-.2 11 4.5 11.2 10.5s-4.5 11-10.5 11.2h-.7z"></path><path class="lineal-fill" d="M10.8 60.2l338.6 338.5h25.2c21.5 0 32.2-25.9 17-41.1L52 18C36.8 2.8 10.9 13.6 10.9 35l-.1 25.2z"></path><path class="lineal-stroke" d="M399.3 350L59.7 10.4l-.1-.1-1.7-1.7c-.1 0-.1-.1-.2-.1C51.5 3 43.4 0 35.1 0c-6.4 0-12.4 1.7-17.6 4.8C7.2 10.5.6 21.3.1 33.2 0 33.8 0 34.4 0 35v339.7c0 19.3 15.7 34.9 34.9 34.9H269c5.7-.2 10.3-4.8 10.5-10.5.2-6-4.5-11-10.5-11.2H34.9c-7.3 0-13.2-5.9-13.2-13.2V86.4l320 320c2.1 2.1 4.8 3.2 7.7 3.2h25.2c9.2 0 18.1-3.7 24.7-10.2 13.6-13.6 13.6-35.8 0-49.4zm-24.7 37.9h-20.7L21.7 55.7V33.6c0-.3.1-.6.1-.9 0-.1 0-.2.1-.4.1-.4.2-.8.3-1.1v-.1c.6-2.1 1.8-3.9 3.3-5.5 2.1-2.2 4.9-3.4 7.7-3.8.1 0 .3 0 .4-.1h1.3c3.4 0 6.7 1.3 9.3 3.9L77.6 59 66.5 70.3c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.8 10.8 10.8 2.8.1 5.6-1.1 7.6-3.1L93 74.4l36.2 36.1-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.9 10.8 10.9 2.8 0 5.6-1.1 7.6-3.2l11.3-11.3 36.2 36.2-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.9 10.8 10.9 2.9.1 5.6-1.1 7.7-3.2l11.2-11.2 34.7 34.7 1.5 1.5-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.8 10.8 10.8 2.9.1 5.6-1.1 7.7-3.2l11.2-11.2 36.2 36.2-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.9 10.8 10.9 2.9 0 5.7-1.2 7.7-3.2l11.3-11.3 19.3 19.3 16.9 16.9-11.3 11.3c-2.1 2-3.2 4.7-3.2 7.6 0 6 4.8 10.9 10.8 10.9 2.9 0 5.7-1.2 7.7-3.1l11.3-11.3 33.3 33.2c2.5 2.5 3.9 5.9 3.9 9.4 0 7.4-5.9 13.3-13.2 13.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/square.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M226.2 350.7H69.8c-6 0-10.8-4.9-10.8-10.9V183.4c-.2-6 4.5-11 10.5-11.2s11 4.5 11.2 10.5V329h145.5c6-.2 11 4.5 11.2 10.5s-4.5 11-10.5 11.2h-.7z"></path><path class="lineal-fill" d="M10.8 60.2l338.6 338.5h25.2c21.5 0 32.2-25.9 17-41.1L52 18C36.8 2.8 10.9 13.6 10.9 35l-.1 25.2z"></path><path class="lineal-stroke" d="M399.3 350L59.7 10.4l-.1-.1-1.7-1.7c-.1 0-.1-.1-.2-.1C51.5 3 43.4 0 35.1 0c-6.4 0-12.4 1.7-17.6 4.8C7.2 10.5.6 21.3.1 33.2 0 33.8 0 34.4 0 35v339.7c0 19.3 15.7 34.9 34.9 34.9H269c5.7-.2 10.3-4.8 10.5-10.5.2-6-4.5-11-10.5-11.2H34.9c-7.3 0-13.2-5.9-13.2-13.2V86.4l320 320c2.1 2.1 4.8 3.2 7.7 3.2h25.2c9.2 0 18.1-3.7 24.7-10.2 13.6-13.6 13.6-35.8 0-49.4zm-24.7 37.9h-20.7L21.7 55.7V33.6c0-.3.1-.6.1-.9 0-.1 0-.2.1-.4.1-.4.2-.8.3-1.1v-.1c.6-2.1 1.8-3.9 3.3-5.5 2.1-2.2 4.9-3.4 7.7-3.8.1 0 .3 0 .4-.1h1.3c3.4 0 6.7 1.3 9.3 3.9L77.6 59 66.5 70.3c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.8 10.8 10.8 2.8.1 5.6-1.1 7.6-3.1L93 74.4l36.2 36.1-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.9 10.8 10.9 2.8 0 5.6-1.1 7.6-3.2l11.3-11.3 36.2 36.2-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.9 10.8 10.9 2.9.1 5.6-1.1 7.7-3.2l11.2-11.2 34.7 34.7 1.5 1.5-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.8 10.8 10.8 2.9.1 5.6-1.1 7.7-3.2l11.2-11.2 36.2 36.2-11.2 11.2c-2.1 2.1-3.2 4.8-3.2 7.7 0 6 4.8 10.9 10.8 10.9 2.9 0 5.7-1.2 7.7-3.2l11.3-11.3 19.3 19.3 16.9 16.9-11.3 11.3c-2.1 2-3.2 4.7-3.2 7.6 0 6 4.8 10.9 10.8 10.9 2.9 0 5.7-1.2 7.7-3.1l11.3-11.3 33.3 33.2c2.5 2.5 3.9 5.9 3.9 9.4 0 7.4-5.9 13.3-13.2 13.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">square</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/square.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/square.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 240.45" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/stars.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M125.69 14.02l29.43 76.91 82.24 4.22-64.05 51.76 21.4 79.52-69.02-44.92-69.02 44.92 21.4-79.52-64.05-51.76 82.24-4.22 29.43-76.91z"></path><path class="lineal-stroke" d="M194.71 240.45a14.06 14.06 0 01-7.65-2.27l-61.37-40-61.37 40a14 14 0 01-21.18-15.39l19-70.71-56.95-46a14 14 0 018.09-24.9l73.15-3.78L112.6 9a14 14 0 0126.18 0L165 77.4l73.13 3.75a14 14 0 018.09 24.9l-56.95 46 19 70.71a14 14 0 01-13.53 17.66zm-69-73a14.06 14.06 0 017.65 2.27l38.31 24.94-11.87-44.15a14 14 0 014.7-14.51l35.56-28.74-45.66-2.35a14 14 0 01-12.37-9l-16.34-42.7-16.34 42.7a14 14 0 01-12.37 9l-45.66 2.35L86.88 136a14 14 0 014.73 14.54L79.73 194.7l38.32-24.94a14 14 0 017.64-2.27zm329.62 73a14.06 14.06 0 01-7.65-2.27l-61.37-40-61.37 40a14 14 0 01-21.18-15.39l19-70.71-56.95-46a14 14 0 018.09-24.9l73.13-3.75L373.22 9a14 14 0 0126.18 0l26.17 68.4 73.13 3.75a14 14 0 01-1.44 28L415 104.93a14 14 0 01-12.37-9l-16.34-42.7L370 95.94a14 14 0 01-12.37 9l-45.66 2.34L347.5 136a14 14 0 014.73 14.54l-11.88 44.16 38.32-24.94a14 14 0 0115.29 0l38.32 24.94-11.88-44.15a14 14 0 1127.07-7.28l21.39 79.52a14 14 0 01-13.53 17.66z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 240.45" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/stars.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M125.69 14.02l29.43 76.91 82.24 4.22-64.05 51.76 21.4 79.52-69.02-44.92-69.02 44.92 21.4-79.52-64.05-51.76 82.24-4.22 29.43-76.91z"></path><path class="lineal-stroke" d="M194.71 240.45a14.06 14.06 0 01-7.65-2.27l-61.37-40-61.37 40a14 14 0 01-21.18-15.39l19-70.71-56.95-46a14 14 0 018.09-24.9l73.15-3.78L112.6 9a14 14 0 0126.18 0L165 77.4l73.13 3.75a14 14 0 018.09 24.9l-56.95 46 19 70.71a14 14 0 01-13.53 17.66zm-69-73a14.06 14.06 0 017.65 2.27l38.31 24.94-11.87-44.15a14 14 0 014.7-14.51l35.56-28.74-45.66-2.35a14 14 0 01-12.37-9l-16.34-42.7-16.34 42.7a14 14 0 01-12.37 9l-45.66 2.35L86.88 136a14 14 0 014.73 14.54L79.73 194.7l38.32-24.94a14 14 0 017.64-2.27zm329.62 73a14.06 14.06 0 01-7.65-2.27l-61.37-40-61.37 40a14 14 0 01-21.18-15.39l19-70.71-56.95-46a14 14 0 018.09-24.9l73.13-3.75L373.22 9a14 14 0 0126.18 0l26.17 68.4 73.13 3.75a14 14 0 01-1.44 28L415 104.93a14 14 0 01-12.37-9l-16.34-42.7L370 95.94a14 14 0 01-12.37 9l-45.66 2.34L347.5 136a14 14 0 014.73 14.54l-11.88 44.16 38.32-24.94a14 14 0 0115.29 0l38.32 24.94-11.88-44.15a14 14 0 1127.07-7.28l21.39 79.52a14 14 0 01-13.53 17.66z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">stars</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/stars.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/stars.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 357.51 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/startup.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M135 260.57A130.42 130.42 0 014.76 130.29C4.76 58.45 63.2 0 135 0s130.33 58.45 130.33 130.29a129.66 129.66 0 01-22.23 72.81 12 12 0 01-20-13.47 106.22 106.22 0 10-88.1 46.86 12 12 0 110 24.08z"></path><path class="lineal-fill" d="M161.8 304.57h-53.51l-27.45-67.71h108.4z"></path><path class="lineal-stroke" d="M161.8 316.61h-53.51a12.05 12.05 0 01-11.16-7.52l-27.44-67.7a12 12 0 0111.15-16.57h108.4a12 12 0 0111.16 16.57l-27.4 67.7a12.06 12.06 0 01-11.16 7.52zm-45.4-24.08h37.29l17.68-43.63H98.71z"></path><path class="lineal-stroke" d="M187.07 282.78H83a12 12 0 110-24.08h104.07a12 12 0 010 24.08z"></path><path class="lineal-fill" d="M236.93 397.56H33.16A21.11 21.11 0 0112 376.45v-50.77a21.12 21.12 0 0121.12-21.11h203.81a21.12 21.12 0 0121.12 21.11v50.77a21.12 21.12 0 01-21.12 21.11z"></path><path class="lineal-stroke" d="M236.93 409.6H33.16A33.19 33.19 0 010 376.45v-50.77a33.19 33.19 0 0133.16-33.15h203.77a33.19 33.19 0 0133.16 33.15v50.77a33.19 33.19 0 01-33.16 33.15zm-203.77-93a9.08 9.08 0 00-9.08 9.07v50.77a9.08 9.08 0 009.08 9.07h203.77a9.08 9.08 0 009.08-9.07v-50.76a9.09 9.09 0 00-9.08-9.07zm289.93 46.5a34.42 34.42 0 1134.42-34.42 34.46 34.46 0 01-34.42 34.42zm0-44.76a10.34 10.34 0 1010.34 10.34 10.35 10.35 0 00-10.34-10.34z"></path><path class="lineal-stroke" d="M323.09 407.87a34.43 34.43 0 1134.42-34.42 34.46 34.46 0 01-34.42 34.42zm0-44.77a10.35 10.35 0 1010.34 10.35 10.36 10.36 0 00-10.34-10.35z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 357.51 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/startup.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M135 260.57A130.42 130.42 0 014.76 130.29C4.76 58.45 63.2 0 135 0s130.33 58.45 130.33 130.29a129.66 129.66 0 01-22.23 72.81 12 12 0 01-20-13.47 106.22 106.22 0 10-88.1 46.86 12 12 0 110 24.08z"></path><path class="lineal-fill" d="M161.8 304.57h-53.51l-27.45-67.71h108.4z"></path><path class="lineal-stroke" d="M161.8 316.61h-53.51a12.05 12.05 0 01-11.16-7.52l-27.44-67.7a12 12 0 0111.15-16.57h108.4a12 12 0 0111.16 16.57l-27.4 67.7a12.06 12.06 0 01-11.16 7.52zm-45.4-24.08h37.29l17.68-43.63H98.71z"></path><path class="lineal-stroke" d="M187.07 282.78H83a12 12 0 110-24.08h104.07a12 12 0 010 24.08z"></path><path class="lineal-fill" d="M236.93 397.56H33.16A21.11 21.11 0 0112 376.45v-50.77a21.12 21.12 0 0121.12-21.11h203.81a21.12 21.12 0 0121.12 21.11v50.77a21.12 21.12 0 01-21.12 21.11z"></path><path class="lineal-stroke" d="M236.93 409.6H33.16A33.19 33.19 0 010 376.45v-50.77a33.19 33.19 0 0133.16-33.15h203.77a33.19 33.19 0 0133.16 33.15v50.77a33.19 33.19 0 01-33.16 33.15zm-203.77-93a9.08 9.08 0 00-9.08 9.07v50.77a9.08 9.08 0 009.08 9.07h203.77a9.08 9.08 0 009.08-9.07v-50.76a9.09 9.09 0 00-9.08-9.07zm289.93 46.5a34.42 34.42 0 1134.42-34.42 34.46 34.46 0 01-34.42 34.42zm0-44.76a10.34 10.34 0 1010.34 10.34 10.35 10.35 0 00-10.34-10.34z"></path><path class="lineal-stroke" d="M323.09 407.87a34.43 34.43 0 1134.42-34.42 34.46 34.46 0 01-34.42 34.42zm0-44.77a10.35 10.35 0 1010.34 10.35 10.36 10.36 0 00-10.34-10.35z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">startup</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/startup.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/startup.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/statistics.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M288.37 276.32h-55.49V209.8a27.74 27.74 0 0127.74-27.75 27.74 27.74 0 0127.75 27.75z"></path><path class="lineal-stroke" d="M288.37 291.15h-55.49a14.83 14.83 0 01-14.83-14.83V209.8a42.58 42.58 0 1185.15 0v66.52a14.83 14.83 0 01-14.83 14.83zm-40.66-29.66h25.83V209.8a12.92 12.92 0 10-25.83 0z"></path><path class="lineal-fill" d="M343.86 276.32h-55.49V176.5a27.74 27.74 0 0127.74-27.74 27.74 27.74 0 0127.75 27.74z"></path><path class="lineal-stroke" d="M343.86 291.15h-55.49a14.83 14.83 0 01-14.83-14.83V176.5a42.58 42.58 0 0185.15 0v99.82a14.83 14.83 0 01-14.83 14.83zm-40.66-29.66H329v-85a12.92 12.92 0 00-25.83 0v85z"></path><path class="lineal-stroke" d="M399.35 291.15h-55.49A14.83 14.83 0 01329 276.32V143.2a42.58 42.58 0 0185.15 0V210a14.83 14.83 0 11-29.66 0v-66.8a12.92 12.92 0 00-25.83 0v118.29h40.66a14.83 14.83 0 010 29.66z"></path><path class="lineal-stroke" d="M316.11 391.77c-108 0-195.88-87.87-195.88-195.88S208.1 0 316.11 0 512 87.87 512 195.89a194.21 194.21 0 01-18.6 83.41 14.83 14.83 0 11-26.83-12.65 164.77 164.77 0 0015.77-70.76c0-91.66-74.57-166.23-166.23-166.23s-166.22 74.57-166.22 166.23 74.56 166.22 166.22 166.22A165.22 165.22 0 00411.55 332a14.83 14.83 0 0117.05 24.27 194.71 194.71 0 01-112.49 35.5z"></path><path class="lineal-stroke" d="M142.6 384.23a14.84 14.84 0 01-10.48-25.32L177 314.07a14.83 14.83 0 0121 21l-44.84 44.84a14.76 14.76 0 01-10.56 4.32z"></path><path class="lineal-fill" d="M69.28 497.17l-54.45-54.45L95 362.59a38.49 38.49 0 0154.45 0 38.49 38.49 0 010 54.45z"></path><path class="lineal-stroke" d="M69.28 512a14.79 14.79 0 01-10.48-4.34L4.34 453.21a14.84 14.84 0 010-21l80.13-80.11a53.34 53.34 0 0175.43 75.43l-80.13 80.13A14.81 14.81 0 0169.28 512zM35.8 442.72l33.48 33.48 69.64-69.64a23.67 23.67 0 10-33.48-33.48z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/statistics.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M288.37 276.32h-55.49V209.8a27.74 27.74 0 0127.74-27.75 27.74 27.74 0 0127.75 27.75z"></path><path class="lineal-stroke" d="M288.37 291.15h-55.49a14.83 14.83 0 01-14.83-14.83V209.8a42.58 42.58 0 1185.15 0v66.52a14.83 14.83 0 01-14.83 14.83zm-40.66-29.66h25.83V209.8a12.92 12.92 0 10-25.83 0z"></path><path class="lineal-fill" d="M343.86 276.32h-55.49V176.5a27.74 27.74 0 0127.74-27.74 27.74 27.74 0 0127.75 27.74z"></path><path class="lineal-stroke" d="M343.86 291.15h-55.49a14.83 14.83 0 01-14.83-14.83V176.5a42.58 42.58 0 0185.15 0v99.82a14.83 14.83 0 01-14.83 14.83zm-40.66-29.66H329v-85a12.92 12.92 0 00-25.83 0v85z"></path><path class="lineal-stroke" d="M399.35 291.15h-55.49A14.83 14.83 0 01329 276.32V143.2a42.58 42.58 0 0185.15 0V210a14.83 14.83 0 11-29.66 0v-66.8a12.92 12.92 0 00-25.83 0v118.29h40.66a14.83 14.83 0 010 29.66z"></path><path class="lineal-stroke" d="M316.11 391.77c-108 0-195.88-87.87-195.88-195.88S208.1 0 316.11 0 512 87.87 512 195.89a194.21 194.21 0 01-18.6 83.41 14.83 14.83 0 11-26.83-12.65 164.77 164.77 0 0015.77-70.76c0-91.66-74.57-166.23-166.23-166.23s-166.22 74.57-166.22 166.23 74.56 166.22 166.22 166.22A165.22 165.22 0 00411.55 332a14.83 14.83 0 0117.05 24.27 194.71 194.71 0 01-112.49 35.5z"></path><path class="lineal-stroke" d="M142.6 384.23a14.84 14.84 0 01-10.48-25.32L177 314.07a14.83 14.83 0 0121 21l-44.84 44.84a14.76 14.76 0 01-10.56 4.32z"></path><path class="lineal-fill" d="M69.28 497.17l-54.45-54.45L95 362.59a38.49 38.49 0 0154.45 0 38.49 38.49 0 010 54.45z"></path><path class="lineal-stroke" d="M69.28 512a14.79 14.79 0 01-10.48-4.34L4.34 453.21a14.84 14.84 0 010-21l80.13-80.11a53.34 53.34 0 0175.43 75.43l-80.13 80.13A14.81 14.81 0 0169.28 512zM35.8 442.72l33.48 33.48 69.64-69.64a23.67 23.67 0 10-33.48-33.48z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">statistics</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/statistics.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/statistics.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 369.33" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/sticker.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M46.5 302.53a12.13 12.13 0 01-9.83-5c-8.32-11.42-9.28-25.61-10.13-38.13-.5-7.42-1-14.44-2.81-20.06-1.69-5.24-5.32-11-9.16-17C7.74 211.57 0 199.36 0 184.66s7.74-26.9 14.57-37.66c3.84-6.06 7.47-11.78 9.16-17 1.83-5.63 2.31-12.64 2.81-20.06.85-12.52 1.81-26.71 10.13-38.14S58.32 55 70 50.29c6.85-2.74 13.32-5.32 18-8.73s9-8.64 13.63-14.26c8.08-9.75 17.25-20.82 31-25.28 13.21-4.29 26.89-.86 39 2.18C179 6 185.88 7.79 192 7.79S205.05 6 212.39 4.2c12.06-3 25.73-6.47 39-2.18 13.75 4.46 22.92 15.52 31 25.28 4.65 5.62 9 10.92 13.63 14.26a12.15 12.15 0 01-14.3 19.65c-7.06-5.14-12.64-11.88-18.05-18.4-6.56-7.92-12.75-15.4-19.79-17.68-6.57-2.13-15.77.18-25.52 2.64-8.45 2.12-17.19 4.32-26.32 4.32s-17.86-2.2-26.31-4.32c-9.75-2.46-19-4.77-25.53-2.64-7 2.28-13.23 9.76-19.79 17.68-5.41 6.52-11 13.26-18 18.39S87 69.68 79 72.85c-9.49 3.8-18.45 7.38-22.71 13.24s-4.84 15.34-5.54 25.48c-.57 8.57-1.18 17.44-3.93 25.93-2.62 8.14-7.25 15.5-11.73 22.5-5.55 8.75-10.79 17-10.79 24.65s5.24 15.91 10.79 24.65c4.48 7.07 9.11 14.37 11.76 22.52 2.75 8.49 3.36 17.35 3.93 25.93.69 10.14 1.34 19.72 5.54 25.48a12.14 12.14 0 01-9.82 19.29zm99.62 66.8a43.2 43.2 0 01-13.46-2c-13.75-4.46-22.92-15.53-31-25.29-4.65-5.61-9-10.92-13.63-14.25a12.15 12.15 0 0114.31-19.65c7 5.13 12.63 11.88 18 18.4 6.56 7.91 12.75 15.39 19.79 17.68 6.57 2.13 15.78-.18 25.52-2.64 8.46-2.12 17.19-4.32 26.32-4.32s17.87 2.2 26.32 4.32c9.74 2.46 19 4.77 25.52 2.64 7-2.29 13.23-9.77 19.79-17.68 5.4-6.52 11-13.27 18-18.4s15.4-8.5 23.4-11.67c9.49-3.79 18.45-7.37 22.71-13.23s4.85-15.34 5.53-25.49c.59-8.57 1.19-17.43 3.94-25.92 2.65-8.15 7.28-15.45 11.76-22.51 5.55-8.75 10.79-17 10.79-24.65s-5.24-15.91-10.79-24.65c-4.48-7.07-9.11-14.37-11.76-22.52-2.76-8.49-3.36-17.35-3.94-25.93-.68-10.14-1.33-19.72-5.53-25.48a12.15 12.15 0 0119.65-14.3c8.32 11.43 9.28 25.62 10.13 38.14.5 7.42 1 14.44 2.81 20.07 1.69 5.23 5.32 10.94 9.16 17 6.83 10.77 14.57 23 14.57 37.67s-7.74 26.9-14.57 37.66c-3.84 6.06-7.47 11.78-9.16 17-1.86 5.67-2.3 12.67-2.84 20.07-.85 12.52-1.81 26.71-10.13 38.14S325.68 314.37 314 319c-6.85 2.74-13.32 5.32-18 8.73s-9 8.64-13.63 14.25c-8.08 9.76-17.25 20.83-31 25.29-13.22 4.29-26.89.85-39-2.18-7.34-1.85-14.27-3.59-20.39-3.59s-13.05 1.74-20.39 3.59c-8 2-16.69 4.2-25.49 4.2z"></path><path class="lineal-fill" d="M309.17 184.66A117.18 117.18 0 11192 67.48a117.18 117.18 0 01117.17 117.18z"></path><path class="lineal-stroke" d="M192 314c-71.31 0-129.32-58-129.32-129.33a129.32 129.32 0 01258.64 0C321.32 256 263.31 314 192 314zm0-234.35a105 105 0 10105 105 105.14 105.14 0 00-105-105z"></path><path class="lineal-stroke" d="M133.34 176.09h-3.5l.56-7.51h15.2c2.72 0 4.61-2.6 4.61-6.33s-1.89-6.34-4.61-6.34h-23.84c-1.91 0-3 1.59-3.34 4.71l-2 18.85v.45a18.17 18.17 0 00-.11 1.83c0 3.85 1.93 5.81 5.73 5.81h11.36c3.58 0 5.4 2 5.4 6.07v1.42c0 3.93-1.77 5.77-5.55 5.77-2.53 0-5.24-.87-5.24-3.3 0-3.87-2.18-5.59-7.09-5.59-3 0-7.08.66-7.08 6.41 0 7.53 6.77 15.15 19.71 15.15 12.34 0 19.42-6.72 19.42-18.44v-1.42c0-11.31-6.95-17.54-19.57-17.54zm40.87-20.18c-12.61 0-19.55 6.71-19.55 18.89v19.8c0 12.18 6.94 18.89 19.55 18.89s19.64-6.71 19.64-18.89v-19.8c0-12.18-7-18.89-19.64-18.89zm-5.39 18.89c0-4.24 1.71-6.22 5.39-6.22s5.48 2 5.48 6.22v19.8c0 4.24-1.74 6.22-5.48 6.22s-5.39-2-5.39-6.22zm90.27-16.74c0-3.12-2.93-5.21-5.67-5.21a4.49 4.49 0 00-4.26 2.57l-26.22 53.86a4.52 4.52 0 00-.51 2 5.4 5.4 0 005.44 5.22 5 5 0 004.49-2.57l26.3-53.93a4.58 4.58 0 00.43-2z"></path><path class="lineal-stroke" d="M257.76 180c-8 0-12.47 4-12.47 11.34v10.61c0 7.32 4.43 11.35 12.47 11.35s12.46-4.14 12.46-11.35v-10.64c0-7.21-4.54-11.34-12.46-11.34zm2.47 11.34v10.61c0 1.66-.71 2.34-2.48 2.34s-2.4-.66-2.4-2.34v-10.64c0-1.67.67-2.33 2.4-2.33s2.48.68 2.48 2.33zm-24.31-13.48v-10.61c0-7.2-4.54-11.34-12.46-11.34s-12.46 4-12.46 11.34v10.61c0 7.32 4.42 11.34 12.46 11.34s12.46-4.13 12.46-11.34zm-10-10.61v10.61c0 1.66-.72 2.33-2.48 2.33s-2.41-.65-2.41-2.33v-10.61c0-1.67.68-2.33 2.41-2.33s2.48.68 2.48 2.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 369.33" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/sticker.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M46.5 302.53a12.13 12.13 0 01-9.83-5c-8.32-11.42-9.28-25.61-10.13-38.13-.5-7.42-1-14.44-2.81-20.06-1.69-5.24-5.32-11-9.16-17C7.74 211.57 0 199.36 0 184.66s7.74-26.9 14.57-37.66c3.84-6.06 7.47-11.78 9.16-17 1.83-5.63 2.31-12.64 2.81-20.06.85-12.52 1.81-26.71 10.13-38.14S58.32 55 70 50.29c6.85-2.74 13.32-5.32 18-8.73s9-8.64 13.63-14.26c8.08-9.75 17.25-20.82 31-25.28 13.21-4.29 26.89-.86 39 2.18C179 6 185.88 7.79 192 7.79S205.05 6 212.39 4.2c12.06-3 25.73-6.47 39-2.18 13.75 4.46 22.92 15.52 31 25.28 4.65 5.62 9 10.92 13.63 14.26a12.15 12.15 0 01-14.3 19.65c-7.06-5.14-12.64-11.88-18.05-18.4-6.56-7.92-12.75-15.4-19.79-17.68-6.57-2.13-15.77.18-25.52 2.64-8.45 2.12-17.19 4.32-26.32 4.32s-17.86-2.2-26.31-4.32c-9.75-2.46-19-4.77-25.53-2.64-7 2.28-13.23 9.76-19.79 17.68-5.41 6.52-11 13.26-18 18.39S87 69.68 79 72.85c-9.49 3.8-18.45 7.38-22.71 13.24s-4.84 15.34-5.54 25.48c-.57 8.57-1.18 17.44-3.93 25.93-2.62 8.14-7.25 15.5-11.73 22.5-5.55 8.75-10.79 17-10.79 24.65s5.24 15.91 10.79 24.65c4.48 7.07 9.11 14.37 11.76 22.52 2.75 8.49 3.36 17.35 3.93 25.93.69 10.14 1.34 19.72 5.54 25.48a12.14 12.14 0 01-9.82 19.29zm99.62 66.8a43.2 43.2 0 01-13.46-2c-13.75-4.46-22.92-15.53-31-25.29-4.65-5.61-9-10.92-13.63-14.25a12.15 12.15 0 0114.31-19.65c7 5.13 12.63 11.88 18 18.4 6.56 7.91 12.75 15.39 19.79 17.68 6.57 2.13 15.78-.18 25.52-2.64 8.46-2.12 17.19-4.32 26.32-4.32s17.87 2.2 26.32 4.32c9.74 2.46 19 4.77 25.52 2.64 7-2.29 13.23-9.77 19.79-17.68 5.4-6.52 11-13.27 18-18.4s15.4-8.5 23.4-11.67c9.49-3.79 18.45-7.37 22.71-13.23s4.85-15.34 5.53-25.49c.59-8.57 1.19-17.43 3.94-25.92 2.65-8.15 7.28-15.45 11.76-22.51 5.55-8.75 10.79-17 10.79-24.65s-5.24-15.91-10.79-24.65c-4.48-7.07-9.11-14.37-11.76-22.52-2.76-8.49-3.36-17.35-3.94-25.93-.68-10.14-1.33-19.72-5.53-25.48a12.15 12.15 0 0119.65-14.3c8.32 11.43 9.28 25.62 10.13 38.14.5 7.42 1 14.44 2.81 20.07 1.69 5.23 5.32 10.94 9.16 17 6.83 10.77 14.57 23 14.57 37.67s-7.74 26.9-14.57 37.66c-3.84 6.06-7.47 11.78-9.16 17-1.86 5.67-2.3 12.67-2.84 20.07-.85 12.52-1.81 26.71-10.13 38.14S325.68 314.37 314 319c-6.85 2.74-13.32 5.32-18 8.73s-9 8.64-13.63 14.25c-8.08 9.76-17.25 20.83-31 25.29-13.22 4.29-26.89.85-39-2.18-7.34-1.85-14.27-3.59-20.39-3.59s-13.05 1.74-20.39 3.59c-8 2-16.69 4.2-25.49 4.2z"></path><path class="lineal-fill" d="M309.17 184.66A117.18 117.18 0 11192 67.48a117.18 117.18 0 01117.17 117.18z"></path><path class="lineal-stroke" d="M192 314c-71.31 0-129.32-58-129.32-129.33a129.32 129.32 0 01258.64 0C321.32 256 263.31 314 192 314zm0-234.35a105 105 0 10105 105 105.14 105.14 0 00-105-105z"></path><path class="lineal-stroke" d="M133.34 176.09h-3.5l.56-7.51h15.2c2.72 0 4.61-2.6 4.61-6.33s-1.89-6.34-4.61-6.34h-23.84c-1.91 0-3 1.59-3.34 4.71l-2 18.85v.45a18.17 18.17 0 00-.11 1.83c0 3.85 1.93 5.81 5.73 5.81h11.36c3.58 0 5.4 2 5.4 6.07v1.42c0 3.93-1.77 5.77-5.55 5.77-2.53 0-5.24-.87-5.24-3.3 0-3.87-2.18-5.59-7.09-5.59-3 0-7.08.66-7.08 6.41 0 7.53 6.77 15.15 19.71 15.15 12.34 0 19.42-6.72 19.42-18.44v-1.42c0-11.31-6.95-17.54-19.57-17.54zm40.87-20.18c-12.61 0-19.55 6.71-19.55 18.89v19.8c0 12.18 6.94 18.89 19.55 18.89s19.64-6.71 19.64-18.89v-19.8c0-12.18-7-18.89-19.64-18.89zm-5.39 18.89c0-4.24 1.71-6.22 5.39-6.22s5.48 2 5.48 6.22v19.8c0 4.24-1.74 6.22-5.48 6.22s-5.39-2-5.39-6.22zm90.27-16.74c0-3.12-2.93-5.21-5.67-5.21a4.49 4.49 0 00-4.26 2.57l-26.22 53.86a4.52 4.52 0 00-.51 2 5.4 5.4 0 005.44 5.22 5 5 0 004.49-2.57l26.3-53.93a4.58 4.58 0 00.43-2z"></path><path class="lineal-stroke" d="M257.76 180c-8 0-12.47 4-12.47 11.34v10.61c0 7.32 4.43 11.35 12.47 11.35s12.46-4.14 12.46-11.35v-10.64c0-7.21-4.54-11.34-12.46-11.34zm2.47 11.34v10.61c0 1.66-.71 2.34-2.48 2.34s-2.4-.66-2.4-2.34v-10.64c0-1.67.67-2.33 2.4-2.33s2.48.68 2.48 2.33zm-24.31-13.48v-10.61c0-7.2-4.54-11.34-12.46-11.34s-12.46 4-12.46 11.34v10.61c0 7.32 4.42 11.34 12.46 11.34s12.46-4.13 12.46-11.34zm-10-10.61v10.61c0 1.66-.72 2.33-2.48 2.33s-2.41-.65-2.41-2.33v-10.61c0-1.67.68-2.33 2.41-2.33s2.48.68 2.48 2.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">sticker</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/sticker.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/sticker.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/target.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="283.8" cy="283.8" r="143"></circle><path class="lineal-stroke" d="M283.8 441.8c-87.1 0-158-70.9-158-158s70.9-158 158-158 158 70.9 158 158-70.9 158-158 158zm0-286.1c-70.7 0-128.1 57.3-128.1 128.1S213 411.9 283.8 411.9s128.1-57.3 128.1-128.1c-.1-70.7-57.4-128-128.1-128.1z"></path><path class="lineal-fill" d="M283.8 210.5c40.5 0 73.3 32.8 73.3 73.3s-32.8 73.3-73.3 73.3-73.3-32.8-73.3-73.3"></path><path class="lineal-stroke" d="M283.8 372.1c-48.7-.1-88.2-39.5-88.2-88.3.2-8.2 7.1-14.8 15.3-14.5 7.9.2 14.3 6.6 14.5 14.5 0 32.2 26.1 58.4 58.4 58.4s58.4-26.1 58.4-58.4-26.1-58.4-58.4-58.4c-8.2-.2-14.8-7.1-14.5-15.3.2-7.9 6.6-14.3 14.5-14.5 48.7-.5 88.7 38.6 89.2 87.3s-38.6 88.7-87.3 89.2h-1.9z"></path><path class="lineal-fill" d="M107.9 55.1l-5.3 47.5-47.5 5.3-40.2-40.1 52.9-52.9z"></path><path class="lineal-stroke" d="M283.8 55.7c-55.3 0-108.8 20.1-150.4 56.7l-15.2-15.2 4.5-40.4c.5-4.5-1.1-9-4.3-12.2L78.3 4.4c-5.8-5.8-15.3-5.8-21.1 0L4.4 57.2c-5.8 5.8-5.8 15.3 0 21.1l40.1 40.1c2.8 2.8 6.6 4.4 10.6 4.4.5 0 1.1 0 1.6-.1l40.4-4.5 15.2 15.2c-36.6 41.5-56.7 95-56.7 150.4C55.7 409.6 158 512 283.8 512c66.2 0 129.1-28.7 172.4-78.7 5.6-6.1 5.1-15.6-1-21.1s-15.6-5.1-21.1 1l-.5.5c-37.7 43.4-92.3 68.4-149.8 68.4-109.3 0-198.3-89-198.3-198.3 0-47.4 17-93.3 48-129.2l140.2 140.2c5.8 5.8 15.3 5.8 21.1 0s5.8-15.3 0-21.1L154.6 133.5c35.9-31 81.8-48 129.2-48 109.4 0 198.3 89 198.3 198.3 0 8.3 6.7 14.9 14.9 14.9s14.9-6.7 14.9-14.9C512 158 409.6 55.7 283.8 55.7zM36.1 67.8l31.7-31.7 24.5 24.5-3.2 28.5-28.5 3.2-24.5-24.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/target.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="283.8" cy="283.8" r="143"></circle><path class="lineal-stroke" d="M283.8 441.8c-87.1 0-158-70.9-158-158s70.9-158 158-158 158 70.9 158 158-70.9 158-158 158zm0-286.1c-70.7 0-128.1 57.3-128.1 128.1S213 411.9 283.8 411.9s128.1-57.3 128.1-128.1c-.1-70.7-57.4-128-128.1-128.1z"></path><path class="lineal-fill" d="M283.8 210.5c40.5 0 73.3 32.8 73.3 73.3s-32.8 73.3-73.3 73.3-73.3-32.8-73.3-73.3"></path><path class="lineal-stroke" d="M283.8 372.1c-48.7-.1-88.2-39.5-88.2-88.3.2-8.2 7.1-14.8 15.3-14.5 7.9.2 14.3 6.6 14.5 14.5 0 32.2 26.1 58.4 58.4 58.4s58.4-26.1 58.4-58.4-26.1-58.4-58.4-58.4c-8.2-.2-14.8-7.1-14.5-15.3.2-7.9 6.6-14.3 14.5-14.5 48.7-.5 88.7 38.6 89.2 87.3s-38.6 88.7-87.3 89.2h-1.9z"></path><path class="lineal-fill" d="M107.9 55.1l-5.3 47.5-47.5 5.3-40.2-40.1 52.9-52.9z"></path><path class="lineal-stroke" d="M283.8 55.7c-55.3 0-108.8 20.1-150.4 56.7l-15.2-15.2 4.5-40.4c.5-4.5-1.1-9-4.3-12.2L78.3 4.4c-5.8-5.8-15.3-5.8-21.1 0L4.4 57.2c-5.8 5.8-5.8 15.3 0 21.1l40.1 40.1c2.8 2.8 6.6 4.4 10.6 4.4.5 0 1.1 0 1.6-.1l40.4-4.5 15.2 15.2c-36.6 41.5-56.7 95-56.7 150.4C55.7 409.6 158 512 283.8 512c66.2 0 129.1-28.7 172.4-78.7 5.6-6.1 5.1-15.6-1-21.1s-15.6-5.1-21.1 1l-.5.5c-37.7 43.4-92.3 68.4-149.8 68.4-109.3 0-198.3-89-198.3-198.3 0-47.4 17-93.3 48-129.2l140.2 140.2c5.8 5.8 15.3 5.8 21.1 0s5.8-15.3 0-21.1L154.6 133.5c35.9-31 81.8-48 129.2-48 109.4 0 198.3 89 198.3 198.3 0 8.3 6.7 14.9 14.9 14.9s14.9-6.7 14.9-14.9C512 158 409.6 55.7 283.8 55.7zM36.1 67.8l31.7-31.7 24.5 24.5-3.2 28.5-28.5 3.2-24.5-24.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">target</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/target.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/target.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/target-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M256 462.39c-113.81 0-206.39-92.58-206.39-206.39S142.19 49.61 256 49.61 462.39 142.19 462.39 256A204.26 204.26 0 01440 349.69 208.42 208.42 0 01380 421a14.42 14.42 0 11-17.34-23 176.25 176.25 0 0070.9-142c0-97.91-79.65-177.56-177.56-177.56S78.44 158.09 78.44 256 158.09 433.56 256 433.56a14.42 14.42 0 110 28.83z"></path><circle class="lineal-fill" cx="256" cy="256" r="96.83"></circle><path class="lineal-stroke" d="M256 367.25A111.25 111.25 0 11367.25 256 111.38 111.38 0 01256 367.25zm0-193.67A82.42 82.42 0 10338.42 256 82.52 82.52 0 00256 173.58zM256 512a14.43 14.43 0 01-14.42-14.42v-47.8a14.42 14.42 0 0128.84 0v47.8A14.42 14.42 0 01256 512zm0-435.36a14.43 14.43 0 01-14.42-14.42v-47.8a14.42 14.42 0 0128.84 0v47.8A14.43 14.43 0 01256 76.64zM62.22 270.42h-47.8a14.42 14.42 0 010-28.84h47.8a14.42 14.42 0 010 28.84zm435.36 0h-47.8a14.42 14.42 0 110-28.84h47.8a14.42 14.42 0 110 28.84z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/target-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M256 462.39c-113.81 0-206.39-92.58-206.39-206.39S142.19 49.61 256 49.61 462.39 142.19 462.39 256A204.26 204.26 0 01440 349.69 208.42 208.42 0 01380 421a14.42 14.42 0 11-17.34-23 176.25 176.25 0 0070.9-142c0-97.91-79.65-177.56-177.56-177.56S78.44 158.09 78.44 256 158.09 433.56 256 433.56a14.42 14.42 0 110 28.83z"></path><circle class="lineal-fill" cx="256" cy="256" r="96.83"></circle><path class="lineal-stroke" d="M256 367.25A111.25 111.25 0 11367.25 256 111.38 111.38 0 01256 367.25zm0-193.67A82.42 82.42 0 10338.42 256 82.52 82.52 0 00256 173.58zM256 512a14.43 14.43 0 01-14.42-14.42v-47.8a14.42 14.42 0 0128.84 0v47.8A14.42 14.42 0 01256 512zm0-435.36a14.43 14.43 0 01-14.42-14.42v-47.8a14.42 14.42 0 0128.84 0v47.8A14.43 14.43 0 01256 76.64zM62.22 270.42h-47.8a14.42 14.42 0 010-28.84h47.8a14.42 14.42 0 010 28.84zm435.36 0h-47.8a14.42 14.42 0 110-28.84h47.8a14.42 14.42 0 110 28.84z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">target-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/target-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/target-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 356.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/team.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M265.2 180.7H144.4v-17.6c0-33.3 27-60.4 60.4-60.4s60.4 27 60.4 60.4v17.6z"></path><path class="lineal-stroke" d="M265.2 191.7H144.4c-6.1 0-11.1-5-11.1-11.1V163c-.5-39.5 31.1-71.8 70.6-72.3s71.8 31.1 72.3 70.6v19.3c0 6.2-4.9 11.1-11 11.1zm-109.7-22.1h98.6v-6.5c.4-27.2-21.4-49.6-48.6-50s-49.6 21.4-50 48.6v7.9z"></path><path class="lineal-fill" d="M250.4 56.7c0 25.2-20.4 45.6-45.6 45.6s-45.6-20.4-45.6-45.6 20.4-45.6 45.6-45.6c25.2 0 45.6 20.4 45.6 45.6z"></path><path class="lineal-stroke" d="M204.8 113.3c-31.3 0-56.7-25.4-56.7-56.7S173.5-.1 204.8-.1s56.7 25.4 56.7 56.7c-.1 31.3-25.4 56.7-56.7 56.7zm0-91.2c-19.1 0-34.5 15.4-34.5 34.5s15.4 34.5 34.5 34.5 34.5-15.4 34.5-34.5c0-19-15.5-34.4-34.5-34.5zm193.7 334.1H296.8c-6.1 0-11.1-5-11.1-11.1v-14.8c0-34.2 27.8-62 62-62 6.1-.2 11.2 4.6 11.4 10.7s-4.6 11.2-10.7 11.4h-.7c-22 0-39.8 17.8-39.8 39.8v3.8h79.6v-3.7c0-3.2-.4-6.5-1.2-9.6-1.4-6 2.3-11.9 8.3-13.3 5.8-1.4 11.7 2.2 13.2 8 1.2 4.9 1.8 9.9 1.8 14.9v14.8c0 6.1-4.9 11.1-11.1 11.1z"></path><path class="lineal-stroke" d="M347.6 290.5c-27.3 0-49.5-22.2-49.5-49.5s22.2-49.5 49.5-49.5 49.5 22.2 49.5 49.5-22.2 49.5-49.5 49.5zm0-76.9c-15.1 0-27.3 12.3-27.3 27.4 0 15.1 12.3 27.3 27.4 27.3S375 256 375 241c0-15.1-12.3-27.3-27.4-27.4zM112.8 356.2H11.1c-6.1 0-11.1-5-11.1-11.1v-14.8c0-34.2 27.8-62 62-62 6.1.2 10.9 5.3 10.7 11.4-.2 5.9-4.9 10.6-10.7 10.7-22 0-39.8 17.8-39.8 39.8v3.8h79.6v-3.7c0-3.2-.4-6.5-1.2-9.6-1.5-5.9 2.2-11.9 8.1-13.4s11.9 2.2 13.4 8.1c1.2 4.9 1.8 9.9 1.8 14.9v14.8c.1 6.1-4.9 11.1-11.1 11.1.1 0 .1 0 0 0z"></path><path class="lineal-stroke" d="M61.9 290.5c-27.3 0-49.5-22.2-49.5-49.5s22.2-49.5 49.5-49.5 49.5 22.2 49.5 49.5-22.1 49.5-49.5 49.5zm0-76.9c-15.1 0-27.3 12.2-27.3 27.4 0 15.1 12.2 27.4 27.4 27.4 15.1 0 27.3-12.2 27.3-27.3 0-15.2-12.3-27.4-27.4-27.5zm142.9 72.1c-6.1 0-11.1-5-11.1-11.1v-56.4c-.2-6.1 4.6-11.2 10.7-11.4 6.1-.2 11.2 4.6 11.4 10.7v57.1c.1 6.2-4.9 11.1-11 11.1z"></path><path class="lineal-stroke" d="M279.5 285.7H130.1c-6.1.2-11.2-4.6-11.4-10.7s4.6-11.2 10.7-11.4h150.2c6.1-.2 11.2 4.6 11.4 10.7s-4.6 11.2-10.7 11.4h-.8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 356.2" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/team.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M265.2 180.7H144.4v-17.6c0-33.3 27-60.4 60.4-60.4s60.4 27 60.4 60.4v17.6z"></path><path class="lineal-stroke" d="M265.2 191.7H144.4c-6.1 0-11.1-5-11.1-11.1V163c-.5-39.5 31.1-71.8 70.6-72.3s71.8 31.1 72.3 70.6v19.3c0 6.2-4.9 11.1-11 11.1zm-109.7-22.1h98.6v-6.5c.4-27.2-21.4-49.6-48.6-50s-49.6 21.4-50 48.6v7.9z"></path><path class="lineal-fill" d="M250.4 56.7c0 25.2-20.4 45.6-45.6 45.6s-45.6-20.4-45.6-45.6 20.4-45.6 45.6-45.6c25.2 0 45.6 20.4 45.6 45.6z"></path><path class="lineal-stroke" d="M204.8 113.3c-31.3 0-56.7-25.4-56.7-56.7S173.5-.1 204.8-.1s56.7 25.4 56.7 56.7c-.1 31.3-25.4 56.7-56.7 56.7zm0-91.2c-19.1 0-34.5 15.4-34.5 34.5s15.4 34.5 34.5 34.5 34.5-15.4 34.5-34.5c0-19-15.5-34.4-34.5-34.5zm193.7 334.1H296.8c-6.1 0-11.1-5-11.1-11.1v-14.8c0-34.2 27.8-62 62-62 6.1-.2 11.2 4.6 11.4 10.7s-4.6 11.2-10.7 11.4h-.7c-22 0-39.8 17.8-39.8 39.8v3.8h79.6v-3.7c0-3.2-.4-6.5-1.2-9.6-1.4-6 2.3-11.9 8.3-13.3 5.8-1.4 11.7 2.2 13.2 8 1.2 4.9 1.8 9.9 1.8 14.9v14.8c0 6.1-4.9 11.1-11.1 11.1z"></path><path class="lineal-stroke" d="M347.6 290.5c-27.3 0-49.5-22.2-49.5-49.5s22.2-49.5 49.5-49.5 49.5 22.2 49.5 49.5-22.2 49.5-49.5 49.5zm0-76.9c-15.1 0-27.3 12.3-27.3 27.4 0 15.1 12.3 27.3 27.4 27.3S375 256 375 241c0-15.1-12.3-27.3-27.4-27.4zM112.8 356.2H11.1c-6.1 0-11.1-5-11.1-11.1v-14.8c0-34.2 27.8-62 62-62 6.1.2 10.9 5.3 10.7 11.4-.2 5.9-4.9 10.6-10.7 10.7-22 0-39.8 17.8-39.8 39.8v3.8h79.6v-3.7c0-3.2-.4-6.5-1.2-9.6-1.5-5.9 2.2-11.9 8.1-13.4s11.9 2.2 13.4 8.1c1.2 4.9 1.8 9.9 1.8 14.9v14.8c.1 6.1-4.9 11.1-11.1 11.1.1 0 .1 0 0 0z"></path><path class="lineal-stroke" d="M61.9 290.5c-27.3 0-49.5-22.2-49.5-49.5s22.2-49.5 49.5-49.5 49.5 22.2 49.5 49.5-22.1 49.5-49.5 49.5zm0-76.9c-15.1 0-27.3 12.2-27.3 27.4 0 15.1 12.2 27.4 27.4 27.4 15.1 0 27.3-12.2 27.3-27.3 0-15.2-12.3-27.4-27.4-27.5zm142.9 72.1c-6.1 0-11.1-5-11.1-11.1v-56.4c-.2-6.1 4.6-11.2 10.7-11.4 6.1-.2 11.2 4.6 11.4 10.7v57.1c.1 6.2-4.9 11.1-11 11.1z"></path><path class="lineal-stroke" d="M279.5 285.7H130.1c-6.1.2-11.2-4.6-11.4-10.7s4.6-11.2 10.7-11.4h150.2c6.1-.2 11.2 4.6 11.4 10.7s-4.6 11.2-10.7 11.4h-.8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">team</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/team.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/team.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telemarketer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M276.1 367.9v-8.5c0-63.6-52.1-115.7-115.7-115.7s-115.7 52-115.7 115.7v8.5c0 16.6 13.4 30 30 30h171.5c16.5 0 29.9-13.4 29.9-30z"></path><path class="lineal-stroke" d="M246.1 409.6H74.6c-23 0-41.7-18.7-41.7-41.7v-8.5c0-70.4 57.1-127.5 127.5-127.5S287.9 289 287.9 359.4v8.5c-.1 23-18.7 41.7-41.8 41.7zm-85.7-154.2c-57.4.1-103.9 46.6-104 104v8.5c0 10.1 8.2 18.2 18.2 18.2h171.5c10.1 0 18.2-8.2 18.2-18.2v-8.5c0-57.5-46.5-104-103.9-104zm145.5-109.9h-23.5c0-67.4-54.6-122-122-122s-122 54.6-122 122H14.9C14.9 65.3 80.2 0 160.4 0s145.5 65.3 145.5 145.5z"></path><path class="lineal-stroke" d="M160.4 251.3c-57 0-103.2-46.2-103.2-103.2S103.4 44.9 160.4 44.9s103.2 46.2 103.2 103.2c-.1 57-46.3 103.1-103.2 103.2zm0-182.9c-44 0-79.7 35.7-79.7 79.7s35.7 79.7 79.7 79.7 79.7-35.7 79.7-79.7c-.1-44-35.7-79.6-79.7-79.7z"></path><path class="lineal-fill" d="M68.3 130.4c0-5.6-2.9-10.8-7.6-13.8-15-9.4-34.7-4.9-44.1 10.1-3.2 5.1-4.9 11.1-4.9 17.1v21.5c0 17.7 14.4 32 32.1 32.1 6 0 11.8-1.7 16.9-4.9 4.7-3 7.6-8.2 7.6-13.8v-48.3z"></path><path class="lineal-stroke" d="M43.8 209.2C19.6 209.1 0 189.5 0 165.3v-21.5C0 119.6 19.5 100 43.7 100c8.2 0 16.3 2.3 23.3 6.7 8.2 5.1 13.1 14.1 13.1 23.8v48.4c.1 9.7-4.9 18.7-13.1 23.8-6.9 4.2-15 6.5-23.2 6.5zm0-85.8c-11.2 0-20.3 9.1-20.4 20.4v21.5c0 11.2 9.1 20.3 20.4 20.4 3.8 0 7.5-1.1 10.7-3.1 1.3-.9 2.1-2.3 2.1-3.9v-48.3c0-1.6-.8-3-2.1-3.9-3.2-2-6.9-3-10.7-3.1z"></path><path class="lineal-fill" d="M252.4 130.4c0-5.6 2.9-10.8 7.6-13.8 15-9.4 34.7-4.9 44.1 10.1 3.2 5.1 4.9 11.1 4.9 17.1v21.5c0 17.7-14.4 32-32.1 32.1-6 0-11.8-1.7-16.9-4.9-4.7-3-7.6-8.2-7.6-13.8v-48.3z"></path><path class="lineal-stroke" d="M276.9 209.2c-8.2 0-16.2-2.3-23.1-6.6-8.2-5.1-13.2-14.1-13.1-23.8v-48.4c-.1-9.7 4.9-18.7 13.1-23.8 20.5-12.8 47.5-6.6 60.3 13.9 4.4 7 6.7 15.1 6.7 23.3v21.5c0 24.2-19.6 43.8-43.9 43.9zm0-85.8c-3.8 0-7.5 1.1-10.7 3.1-1.3.9-2.1 2.3-2.1 3.9v48.4c0 1.6.8 3 2.1 3.9 9.5 5.9 22.1 3 28-6.5 2-3.2 3.1-7 3.1-10.8v-21.5c0-11.3-9.1-20.4-20.4-20.5z"></path><path class="lineal-stroke" d="M251.2 195.9h-83.3c-6.5 0-11.7-5.2-11.7-11.7s5.2-11.7 11.7-11.7h83.3c6.5 0 11.7 5.3 11.7 11.7 0 6.5-5.3 11.7-11.7 11.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320.8 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telemarketer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M276.1 367.9v-8.5c0-63.6-52.1-115.7-115.7-115.7s-115.7 52-115.7 115.7v8.5c0 16.6 13.4 30 30 30h171.5c16.5 0 29.9-13.4 29.9-30z"></path><path class="lineal-stroke" d="M246.1 409.6H74.6c-23 0-41.7-18.7-41.7-41.7v-8.5c0-70.4 57.1-127.5 127.5-127.5S287.9 289 287.9 359.4v8.5c-.1 23-18.7 41.7-41.8 41.7zm-85.7-154.2c-57.4.1-103.9 46.6-104 104v8.5c0 10.1 8.2 18.2 18.2 18.2h171.5c10.1 0 18.2-8.2 18.2-18.2v-8.5c0-57.5-46.5-104-103.9-104zm145.5-109.9h-23.5c0-67.4-54.6-122-122-122s-122 54.6-122 122H14.9C14.9 65.3 80.2 0 160.4 0s145.5 65.3 145.5 145.5z"></path><path class="lineal-stroke" d="M160.4 251.3c-57 0-103.2-46.2-103.2-103.2S103.4 44.9 160.4 44.9s103.2 46.2 103.2 103.2c-.1 57-46.3 103.1-103.2 103.2zm0-182.9c-44 0-79.7 35.7-79.7 79.7s35.7 79.7 79.7 79.7 79.7-35.7 79.7-79.7c-.1-44-35.7-79.6-79.7-79.7z"></path><path class="lineal-fill" d="M68.3 130.4c0-5.6-2.9-10.8-7.6-13.8-15-9.4-34.7-4.9-44.1 10.1-3.2 5.1-4.9 11.1-4.9 17.1v21.5c0 17.7 14.4 32 32.1 32.1 6 0 11.8-1.7 16.9-4.9 4.7-3 7.6-8.2 7.6-13.8v-48.3z"></path><path class="lineal-stroke" d="M43.8 209.2C19.6 209.1 0 189.5 0 165.3v-21.5C0 119.6 19.5 100 43.7 100c8.2 0 16.3 2.3 23.3 6.7 8.2 5.1 13.1 14.1 13.1 23.8v48.4c.1 9.7-4.9 18.7-13.1 23.8-6.9 4.2-15 6.5-23.2 6.5zm0-85.8c-11.2 0-20.3 9.1-20.4 20.4v21.5c0 11.2 9.1 20.3 20.4 20.4 3.8 0 7.5-1.1 10.7-3.1 1.3-.9 2.1-2.3 2.1-3.9v-48.3c0-1.6-.8-3-2.1-3.9-3.2-2-6.9-3-10.7-3.1z"></path><path class="lineal-fill" d="M252.4 130.4c0-5.6 2.9-10.8 7.6-13.8 15-9.4 34.7-4.9 44.1 10.1 3.2 5.1 4.9 11.1 4.9 17.1v21.5c0 17.7-14.4 32-32.1 32.1-6 0-11.8-1.7-16.9-4.9-4.7-3-7.6-8.2-7.6-13.8v-48.3z"></path><path class="lineal-stroke" d="M276.9 209.2c-8.2 0-16.2-2.3-23.1-6.6-8.2-5.1-13.2-14.1-13.1-23.8v-48.4c-.1-9.7 4.9-18.7 13.1-23.8 20.5-12.8 47.5-6.6 60.3 13.9 4.4 7 6.7 15.1 6.7 23.3v21.5c0 24.2-19.6 43.8-43.9 43.9zm0-85.8c-3.8 0-7.5 1.1-10.7 3.1-1.3.9-2.1 2.3-2.1 3.9v48.4c0 1.6.8 3 2.1 3.9 9.5 5.9 22.1 3 28-6.5 2-3.2 3.1-7 3.1-10.8v-21.5c0-11.3-9.1-20.4-20.4-20.5z"></path><path class="lineal-stroke" d="M251.2 195.9h-83.3c-6.5 0-11.7-5.2-11.7-11.7s5.2-11.7 11.7-11.7h83.3c6.5 0 11.7 5.3 11.7 11.7 0 6.5-5.3 11.7-11.7 11.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">telemarketer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telemarketer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telemarketer.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 390.9 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M280.5 115.2v-24c-1.6-.5-3.2-1-5-1.5-16-4.6-50.4-10.9-80.1-10.9s-64.2 6.3-80.2 10.9c-1.7.5-2.7.9-4.2 1.4l.7 21.8v2.3c0 17.8-14.5 32.3-32.3 32.3H44.2c-17.8 0-32.3-14.5-32.3-32.3v-.3l.1-9.4c.9-7.2 2.8-14.2 5.8-20.8 2.6-6 6-11.7 10.1-16.8 31.1-39.8 79.6-56 167.5-56 121.5 0 165.8 53.5 167.7 55.9 4.1 5.2 7.5 10.9 10.1 16.9 2.9 6.6 4.8 13.7 5.7 20.8l.1 9.4c.2 17.8-14.2 32.4-32 32.6h-34.2c-17.8.1-32.2-14.4-32.3-32.3 0 .1 0 .1 0 0z"></path><path class="lineal-stroke" d="M346.7 159.4h-33.9c-24.4 0-44.2-19.8-44.2-44.2v-15.1c-15.6-4-46.1-9.5-73.2-9.5-26.7 0-56.4 5.2-72.3 9.2l.4 12.7v2.7c0 24.4-19.8 44.2-44.2 44.2H44.2C19.8 159.4 0 139.6 0 115.2v-.4l.1-9.5c0-.5 0-.9.1-1.3 1.1-8.3 3.3-16.5 6.7-24.2l.1-.1c3-6.9 6.9-13.4 11.6-19.3C52.2 17.5 103.4 0 195.4 0c52.5 0 97.6 9.6 134.1 28.4 28.6 14.8 41.4 30.3 42.9 32 4.7 6 8.6 12.5 11.7 19.5 3.4 7.7 5.6 15.9 6.6 24.2.1.4.1.9.1 1.3l.1 9.4c.2 24.4-19.4 44.4-43.8 44.6h-.4zM195.5 66.9c32.1 0 67.4 6.8 83.4 11.4 1.1.3 2.2.7 3.3 1l1.8.6c5.1 1.5 8.5 6.1 8.5 11.4v24c0 11.3 9.1 20.4 20.4 20.4h33.9c11.3 0 20.4-9.2 20.4-20.4v-.2l-.1-8.8c-.8-5.8-2.4-11.5-4.7-16.9-2.2-5.1-5.1-9.9-8.5-14.3-.1-.1-10.6-13-35.2-25.7-22.9-11.6-62.7-25.6-123.3-25.6-83.8 0-129.6 14.9-158.2 51.4 0 0 0 .1-.1.1-3.4 4.4-6.3 9.1-8.5 14.2-2.3 5.4-3.9 11-4.7 16.8l-.1 8.7c-.1 11.3 9 20.5 20.2 20.6h35.4c11.3 0 20.4-9.1 20.4-20.4v-2.1l-.7-21.7c-.2-5.4 3.4-10.3 8.6-11.8.5-.1.9-.3 1.3-.4.8-.3 1.8-.6 3-1 15.9-4.5 51.2-11.3 83.5-11.3z"></path><path class="lineal-stroke" d="M333.9 409.6H57c-17.1 0-31-13.9-31-31 0-.7 0-1.5.1-2.2l11.8-159.1c1-14.4 11.9-26.2 26.2-28.3l64.3-11 7.8-22.7c4.3-12.5 16.1-20.9 29.3-20.9h59.9c13.2 0 25 8.4 29.3 20.9l7.8 22.7 64.3 11c14.3 2.1 25.2 13.9 26.2 28.3l11.8 159.1c1.2 17.1-11.6 31.9-28.7 33.2h-2.2zM165.5 158.1c-3.1 0-5.8 2-6.8 4.9l-10.1 29.3c-1.4 4.1-5 7.1-9.2 7.9L68 212.4l-.3.1c-3.3.5-5.9 3.2-6.1 6.6l-11.8 159c-.3 3.9 2.7 7.4 6.6 7.7h277.4c4 0 7.2-3.2 7.2-7.2v-.5L329.3 219c-.2-3.4-2.8-6.1-6.1-6.6l-.3-.1-71.4-12.2c-4.3-.7-7.8-3.8-9.2-7.9l-10-29.3c-1-2.9-3.7-4.8-6.8-4.9h-60z"></path><path class="lineal-stroke" d="M195.5 357.1c-39.7 0-71.8-32.2-71.8-71.8s32.2-71.8 71.8-71.8c6.6 0 11.9 5.3 11.9 11.9 0 6.6-5.3 11.9-11.9 11.9-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48c0-10.9-3.7-21.5-10.5-30-4.1-5.1-3.3-12.6 1.8-16.7s12.6-3.3 16.7 1.8c24.8 31 19.8 76.2-11.2 101-12.7 10.2-28.6 15.7-44.8 15.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 390.9 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M280.5 115.2v-24c-1.6-.5-3.2-1-5-1.5-16-4.6-50.4-10.9-80.1-10.9s-64.2 6.3-80.2 10.9c-1.7.5-2.7.9-4.2 1.4l.7 21.8v2.3c0 17.8-14.5 32.3-32.3 32.3H44.2c-17.8 0-32.3-14.5-32.3-32.3v-.3l.1-9.4c.9-7.2 2.8-14.2 5.8-20.8 2.6-6 6-11.7 10.1-16.8 31.1-39.8 79.6-56 167.5-56 121.5 0 165.8 53.5 167.7 55.9 4.1 5.2 7.5 10.9 10.1 16.9 2.9 6.6 4.8 13.7 5.7 20.8l.1 9.4c.2 17.8-14.2 32.4-32 32.6h-34.2c-17.8.1-32.2-14.4-32.3-32.3 0 .1 0 .1 0 0z"></path><path class="lineal-stroke" d="M346.7 159.4h-33.9c-24.4 0-44.2-19.8-44.2-44.2v-15.1c-15.6-4-46.1-9.5-73.2-9.5-26.7 0-56.4 5.2-72.3 9.2l.4 12.7v2.7c0 24.4-19.8 44.2-44.2 44.2H44.2C19.8 159.4 0 139.6 0 115.2v-.4l.1-9.5c0-.5 0-.9.1-1.3 1.1-8.3 3.3-16.5 6.7-24.2l.1-.1c3-6.9 6.9-13.4 11.6-19.3C52.2 17.5 103.4 0 195.4 0c52.5 0 97.6 9.6 134.1 28.4 28.6 14.8 41.4 30.3 42.9 32 4.7 6 8.6 12.5 11.7 19.5 3.4 7.7 5.6 15.9 6.6 24.2.1.4.1.9.1 1.3l.1 9.4c.2 24.4-19.4 44.4-43.8 44.6h-.4zM195.5 66.9c32.1 0 67.4 6.8 83.4 11.4 1.1.3 2.2.7 3.3 1l1.8.6c5.1 1.5 8.5 6.1 8.5 11.4v24c0 11.3 9.1 20.4 20.4 20.4h33.9c11.3 0 20.4-9.2 20.4-20.4v-.2l-.1-8.8c-.8-5.8-2.4-11.5-4.7-16.9-2.2-5.1-5.1-9.9-8.5-14.3-.1-.1-10.6-13-35.2-25.7-22.9-11.6-62.7-25.6-123.3-25.6-83.8 0-129.6 14.9-158.2 51.4 0 0 0 .1-.1.1-3.4 4.4-6.3 9.1-8.5 14.2-2.3 5.4-3.9 11-4.7 16.8l-.1 8.7c-.1 11.3 9 20.5 20.2 20.6h35.4c11.3 0 20.4-9.1 20.4-20.4v-2.1l-.7-21.7c-.2-5.4 3.4-10.3 8.6-11.8.5-.1.9-.3 1.3-.4.8-.3 1.8-.6 3-1 15.9-4.5 51.2-11.3 83.5-11.3z"></path><path class="lineal-stroke" d="M333.9 409.6H57c-17.1 0-31-13.9-31-31 0-.7 0-1.5.1-2.2l11.8-159.1c1-14.4 11.9-26.2 26.2-28.3l64.3-11 7.8-22.7c4.3-12.5 16.1-20.9 29.3-20.9h59.9c13.2 0 25 8.4 29.3 20.9l7.8 22.7 64.3 11c14.3 2.1 25.2 13.9 26.2 28.3l11.8 159.1c1.2 17.1-11.6 31.9-28.7 33.2h-2.2zM165.5 158.1c-3.1 0-5.8 2-6.8 4.9l-10.1 29.3c-1.4 4.1-5 7.1-9.2 7.9L68 212.4l-.3.1c-3.3.5-5.9 3.2-6.1 6.6l-11.8 159c-.3 3.9 2.7 7.4 6.6 7.7h277.4c4 0 7.2-3.2 7.2-7.2v-.5L329.3 219c-.2-3.4-2.8-6.1-6.1-6.6l-.3-.1-71.4-12.2c-4.3-.7-7.8-3.8-9.2-7.9l-10-29.3c-1-2.9-3.7-4.8-6.8-4.9h-60z"></path><path class="lineal-stroke" d="M195.5 357.1c-39.7 0-71.8-32.2-71.8-71.8s32.2-71.8 71.8-71.8c6.6 0 11.9 5.3 11.9 11.9 0 6.6-5.3 11.9-11.9 11.9-26.5 0-48 21.5-48 48s21.5 48 48 48 48-21.5 48-48c0-10.9-3.7-21.5-10.5-30-4.1-5.1-3.3-12.6 1.8-16.7s12.6-3.3 16.7 1.8c24.8 31 19.8 76.2-11.2 101-12.7 10.2-28.6 15.7-44.8 15.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">telephone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telephone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telephone.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.4" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M495.6 417c-18.7 10.7-38.5 16.2-59.2 16.2-45.6 0-88.3-33-140.1-84.8L158.4 210.6c-40.9-41-67.7-68.8-76.3-106.1-7.2-31.3-3-60.8 12.7-88.2-7 2.1-13.4 5.9-18.6 11.2L53.3 50.4C17.1 86.6 8.1 123.5 18.5 168.2c8.6 37.3 33.8 76.9 74.7 117.9l132.6 132.6c51.8 51.8 101.2 78.1 146.8 78.1 33.6 0 60.7-10.2 88.8-38.3l22.9-22.9c5.3-5.1 9.2-11.5 11.3-18.6z"></path><path class="lineal-stroke" d="M497.3 443.1c16.2-18.4 19.3-44.9 7.7-66.5-19-35.8-77.5-71.8-89.1-78.7l-.2-.1c-10.2-5.9-21.2-9-31.6-9-16.3 0-30.4 7.7-38.9 21.2-9.9 11.9-18 20.6-20.2 22.7-6.5 4.4-11.9 6.6-16.9 6.9l-1.6-1.5-137.8-137.7c-39.9-40-64.8-66.1-72.4-99.1-5.9-25.4-3.1-49.6 8.2-72.1 1.1-.1 2.2-.2 3.2-.2 4.9 0 9.7 1.2 14.1 3.5 21.3 11.3 45.8 44.7 61.6 72.2l.4.8c4.6 8.1 6.2 16.3 4.5 22.5-1.1 4-3.8 7.4-7.4 9.4-6.8 4.3-8.8 13.2-4.6 20 4.1 6.6 12.7 8.7 19.4 4.9 10-5.8 17.4-15.4 20.5-26.6 3.9-13.8 1.3-29.8-7.2-44.8l-.1-.2-.3-.6c-11.1-19.2-40.4-66-73.2-83.4-8.5-4.5-18-6.8-27.6-6.8-13 0-25.7 4.3-36 12.3l-.4.3c-.7.6-1.5 1.2-2.2 1.8-.2.2-.4.3-.6.5-.8.8-1.7 1.5-2.5 2.3l-23 23C4.8 78.4-7.5 120.2 4.3 171.5c.6 2.5 1.2 5 1.9 7.5.4 1.6.9 3.1 1.4 4.7 8.5 26.9 24.6 54.8 48.2 83.1.9 1.1 1.9 2.3 2.8 3.4s2 2.3 3.1 3.6c1.5 1.7 3.1 3.5 4.6 5.2 4 4.4 8.1 8.8 12.4 13.3l4 4L215.6 429c5.1 5.1 10.2 10 15.3 14.7 49.2 45 96.8 67.7 141.8 67.7 39.1 0 69.7-13.1 99.1-42.5l22.9-22.9c.8-.8 1.6-1.6 2.3-2.5l.3-.4zm-155.6-86.7l.3-.2c5.5-3.9 21.3-22.7 26.1-28.4.5-.6.9-1.2 1.3-1.9 3.2-5.4 8-8.1 14.7-8.1 5.4 0 11.3 1.8 17.1 5.1 23.1 13.7 65.5 43.2 78.2 67.2 2.8 5.3 4 11.3 3.4 17.2-14.4 7.4-30.3 11.2-46.5 11.2-33.6 0-67-21.8-104.7-56.4 3.5-1.5 6.9-3.5 10.1-5.7zM148.2 220.8L286 358.6c53.5 53.5 99.5 89.1 150.4 89.1 5.5 0 11.1-.4 16.6-1.1l-1.8 1.8c-24.2 24.2-46.9 34-78.6 34-41.6 0-87.6-24.9-136.6-73.9L103.4 275.9c-39-39-62.8-76.4-70.8-110.9-9.7-41.7-.4-72.9 31-104.3l1.7-1.7c-2 16.3-1.1 32.9 2.8 48.9 9.4 40.5 36.5 69.3 80.1 112.9z"></path><path class="lineal-stroke" d="M359 230.2c-.7 0-1.4-.1-2.1-.1-7.9-1.2-13.4-8.5-12.3-16.4 3.3-22.3-12.2-43-34.5-46.3-3.9-.6-7.9-.6-11.8 0-8 1-15.2-4.7-16.1-12.7-.9-7.7 4.3-14.7 12-16 38.2-5.6 73.6 20.9 79.2 59 1 6.7 1 13.5 0 20.1-1.1 7.1-7.2 12.4-14.4 12.4z"></path><path class="lineal-stroke" d="M415 225.8h-1.1c-8-.6-14-7.5-13.4-15.5 3.8-50.8-34.2-95-85-98.8-4.6-.3-9.2-.3-13.8 0-8 .8-15.1-5-15.9-13s5-15.1 13-15.9c.2 0 .5 0 .7-.1 66.7-5 124.9 45 129.9 111.8.5 6 .5 12.1 0 18.1-.5 7.6-6.8 13.4-14.4 13.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 511.4" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M495.6 417c-18.7 10.7-38.5 16.2-59.2 16.2-45.6 0-88.3-33-140.1-84.8L158.4 210.6c-40.9-41-67.7-68.8-76.3-106.1-7.2-31.3-3-60.8 12.7-88.2-7 2.1-13.4 5.9-18.6 11.2L53.3 50.4C17.1 86.6 8.1 123.5 18.5 168.2c8.6 37.3 33.8 76.9 74.7 117.9l132.6 132.6c51.8 51.8 101.2 78.1 146.8 78.1 33.6 0 60.7-10.2 88.8-38.3l22.9-22.9c5.3-5.1 9.2-11.5 11.3-18.6z"></path><path class="lineal-stroke" d="M497.3 443.1c16.2-18.4 19.3-44.9 7.7-66.5-19-35.8-77.5-71.8-89.1-78.7l-.2-.1c-10.2-5.9-21.2-9-31.6-9-16.3 0-30.4 7.7-38.9 21.2-9.9 11.9-18 20.6-20.2 22.7-6.5 4.4-11.9 6.6-16.9 6.9l-1.6-1.5-137.8-137.7c-39.9-40-64.8-66.1-72.4-99.1-5.9-25.4-3.1-49.6 8.2-72.1 1.1-.1 2.2-.2 3.2-.2 4.9 0 9.7 1.2 14.1 3.5 21.3 11.3 45.8 44.7 61.6 72.2l.4.8c4.6 8.1 6.2 16.3 4.5 22.5-1.1 4-3.8 7.4-7.4 9.4-6.8 4.3-8.8 13.2-4.6 20 4.1 6.6 12.7 8.7 19.4 4.9 10-5.8 17.4-15.4 20.5-26.6 3.9-13.8 1.3-29.8-7.2-44.8l-.1-.2-.3-.6c-11.1-19.2-40.4-66-73.2-83.4-8.5-4.5-18-6.8-27.6-6.8-13 0-25.7 4.3-36 12.3l-.4.3c-.7.6-1.5 1.2-2.2 1.8-.2.2-.4.3-.6.5-.8.8-1.7 1.5-2.5 2.3l-23 23C4.8 78.4-7.5 120.2 4.3 171.5c.6 2.5 1.2 5 1.9 7.5.4 1.6.9 3.1 1.4 4.7 8.5 26.9 24.6 54.8 48.2 83.1.9 1.1 1.9 2.3 2.8 3.4s2 2.3 3.1 3.6c1.5 1.7 3.1 3.5 4.6 5.2 4 4.4 8.1 8.8 12.4 13.3l4 4L215.6 429c5.1 5.1 10.2 10 15.3 14.7 49.2 45 96.8 67.7 141.8 67.7 39.1 0 69.7-13.1 99.1-42.5l22.9-22.9c.8-.8 1.6-1.6 2.3-2.5l.3-.4zm-155.6-86.7l.3-.2c5.5-3.9 21.3-22.7 26.1-28.4.5-.6.9-1.2 1.3-1.9 3.2-5.4 8-8.1 14.7-8.1 5.4 0 11.3 1.8 17.1 5.1 23.1 13.7 65.5 43.2 78.2 67.2 2.8 5.3 4 11.3 3.4 17.2-14.4 7.4-30.3 11.2-46.5 11.2-33.6 0-67-21.8-104.7-56.4 3.5-1.5 6.9-3.5 10.1-5.7zM148.2 220.8L286 358.6c53.5 53.5 99.5 89.1 150.4 89.1 5.5 0 11.1-.4 16.6-1.1l-1.8 1.8c-24.2 24.2-46.9 34-78.6 34-41.6 0-87.6-24.9-136.6-73.9L103.4 275.9c-39-39-62.8-76.4-70.8-110.9-9.7-41.7-.4-72.9 31-104.3l1.7-1.7c-2 16.3-1.1 32.9 2.8 48.9 9.4 40.5 36.5 69.3 80.1 112.9z"></path><path class="lineal-stroke" d="M359 230.2c-.7 0-1.4-.1-2.1-.1-7.9-1.2-13.4-8.5-12.3-16.4 3.3-22.3-12.2-43-34.5-46.3-3.9-.6-7.9-.6-11.8 0-8 1-15.2-4.7-16.1-12.7-.9-7.7 4.3-14.7 12-16 38.2-5.6 73.6 20.9 79.2 59 1 6.7 1 13.5 0 20.1-1.1 7.1-7.2 12.4-14.4 12.4z"></path><path class="lineal-stroke" d="M415 225.8h-1.1c-8-.6-14-7.5-13.4-15.5 3.8-50.8-34.2-95-85-98.8-4.6-.3-9.2-.3-13.8 0-8 .8-15.1-5-15.9-13s5-15.1 13-15.9c.2 0 .5 0 .7-.1 66.7-5 124.9 45 129.9 111.8.5 6 .5 12.1 0 18.1-.5 7.6-6.8 13.4-14.4 13.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">telephone-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telephone-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telephone-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M402.4 437.9c0-10.5-4.4-20.4-12.6-28.7-5.1-5.6-10.6-11-16-16.1-2.7-2.6-5.5-5.3-8.1-8l-23.4-23.4c-18-18-41.3-18-59.4 0-2.4 2.4-4.9 4.8-7.3 7.2-6.4 6.4-13.1 12.9-19.6 19.9-11.6-5.2-23-12.4-36.5-23.2-13.4-10.9-62.2-59.7-73.2-73.2-10.7-13.5-17.9-25-23.2-36.5 7-6.4 13.5-13.1 19.9-19.6 2.4-2.4 4.8-4.9 7.2-7.3 18-18 18-41.3 0-59.4l-23.4-23.4c-2.7-2.7-5.4-5.4-8-8.1-5.2-5.3-10.6-10.8-16.1-16-8.3-8.2-18.3-12.6-28.7-12.6s-20.5 4.5-29.1 12.7l-.2.2L33.4 134c-10.8 10.6-17.4 24.8-18.6 39.9-2.1 25 5.3 48.4 11 63.6C39.6 275 60.4 309.7 91.3 347c11.2 13.3 23.2 26 35.9 37.8 11.8 12.7 24.4 24.7 37.8 35.8 37.2 31 72 51.7 109.5 65.6 15.3 5.7 38.6 13 63.6 11 15.1-1.2 29.3-7.8 39.9-18.6l11.6-11.4.2-.2c8.2-8.5 12.6-18.6 12.6-29.1z"></path><path class="lineal-stroke" d="M507 237.1C507 106.4 400.7 0 270 0c-54.9 0-108.2 19.1-150.6 54-6.1 5.1-7 14.2-1.9 20.3 5.1 6.1 14.1 7 20.2 2 37.3-30.6 84-47.4 132.3-47.4 114.9 0 208.3 93.4 208.3 208.3-.1 63.1-28.7 122.8-77.8 162.4l-.2-.2c-5.4-5.8-11.1-11.4-16.4-16.5l-.2-.1c-2.5-2.3-5-4.8-7.4-7.3l-23.8-23.8c-11.6-11.6-25.4-17.7-39.9-17.7s-28.3 6.1-39.9 17.7l-3.4 3.4c-1.1 1.1-2.6 2.5-3.8 3.7l-1.8 1.7c-3.5 3.5-7.1 7-10.8 10.7-8.6-4.9-16.8-10.5-24.4-16.7-12.9-10.5-60.4-58.1-71-71-6.2-7.7-11.8-15.8-16.8-24.4 3.7-3.6 7.2-7.2 10.7-10.7l1.7-1.8c1.3-1.3 2.6-2.6 3.8-3.9 1.1-1.1 2.2-2.3 3.4-3.4 23.5-23.5 23.5-56.2 0-79.7L149 148.3c4.5-6.1 9.4-11.8 14.8-17.1 58.5-58.5 153.6-58.5 212 0 44.9 45 56.6 113.4 29.3 170.8-3.4 7.2-.4 15.8 6.8 19.2s15.8.4 19.2-6.8c32.6-68.4 18.7-149.9-34.9-203.5-69.7-69.7-183.1-69.7-252.7 0-5.3 5.3-10.3 10.9-14.9 16.8-5-5.2-10.3-10.6-16-15.8-10.9-11-24.3-16.7-38.6-16.7s-27.8 5.7-39.1 16.6l-.2.2-.2.2-.1.1-11.3 11.6C9.9 136.9 1.8 154.2.4 172.7c-2.3 27.8 5.7 53.2 11.8 69.8 14.5 39.2 36.1 75.3 68.1 113.7C91.7 369.9 104 382.8 117 395c12.2 13 25.1 25.3 38.8 36.8 38.4 31.9 74.5 53.5 113.6 68 14.2 5.2 35.8 12.2 60 12.2 3.3 0 6.7-.1 10-.4 18.5-1.5 35.8-9.5 48.7-22.7l11.6-11.3.1-.1.2-.2.2-.2c10.9-11.3 16.6-24.9 16.6-39.1 0-4.5-.6-9-1.8-13.4 58-45 91.9-114.2 92-187.5zM379.5 457L368 468.4l-.1.1c-8.2 8.4-19.2 13.6-30.9 14.4-2.5.2-5 .3-7.5.3-19.5 0-37.8-6-49.9-10.4-36-13.4-69.5-33.4-105.2-63.1-12.9-10.8-25.1-22.3-36.6-34.6-.2-.3-.5-.5-.7-.7-12.3-11.4-23.8-23.6-34.6-36.5-29.8-35.9-49.9-69.4-63.3-105.4-5.2-14.1-11.9-35.3-10.1-57.4.9-11.8 6-22.8 14.5-31l.1-.1L55 132.5c5.8-5.6 12.4-8.5 19.1-8.5s13 2.9 18.6 8.4l.4.4c5.3 4.9 10.6 10.3 15.5 15.3 2.6 2.7 5.2 5.4 7.8 8l23.8 23.8c12.4 12.4 12.4 26.6 0 39l-3.6 3.6c-1.2 1.2-2.4 2.5-3.7 3.8l-1.9 1.8c-5.6 5.7-11.5 11.6-17.6 17.2-4.6 4.2-6 10.9-3.4 16.5 5.7 12.7 13.7 25.2 25 39.5l.1.2c11.7 14.4 60.9 63.6 75.3 75.3l.1.1c14.3 11.3 26.9 19.3 39.5 25 5.7 2.6 12.3 1.2 16.5-3.4 5.6-6.1 11.5-12 17.3-17.6l1.9-1.8c1.2-1.2 2.4-2.4 3.7-3.6s2.4-2.4 3.6-3.6c6.1-6.1 12.8-9.3 19.5-9.3s13.4 3.2 19.5 9.3l23.8 23.8c2.6 2.6 5.3 5.2 8 7.8 5 4.9 10.4 10.1 15.3 15.5l.4.4c3.9 3.9 8.4 10.3 8.4 18.6.1 6.6-2.8 13.2-8.4 19z"></path><path class="lineal-stroke" d="M274.8 258.4h-36.5c.1-4.4 6.9-9 14.7-14.3 13.4-9.2 30-20.6 30-40.4 0-20.4-18.1-31.4-35.1-31.4-16.6 0-34.1 10.2-34.1 29.2 0 8.7 3.9 13.2 11.6 13.2 8.6 0 13.3-5 13.3-9.7 0-7.8 5.1-9.4 9.4-9.4 7.1 0 9.6 4.8 9.6 8.8 0 8-9.9 15.2-20.4 22.9-12.4 9.1-25.2 18.5-25.2 31.2v14c0 5.2 6.6 8.4 11.3 8.4h51.5c4.4 0 8.2-5.3 8.2-11.4s-3.8-11.1-8.3-11.1z"></path><path class="lineal-stroke" d="M351.9 234.9h-4.8v-8.7c0-5-5-8.2-12.7-8.2s-12.7 3.2-12.7 8.2v8.7H313l24.6-49.3c.5-1 .8-2.2.8-3.3 0-6.2-8.2-10-12.7-10-4.6-.1-8.8 2.5-10.7 6.6l-33.4 65.5c-.8 1.5-1.3 3.2-1.3 5 0 5.5 3.6 9.3 9 9.3h32.4v13.9c0 5.8 6.6 8.4 12.7 8.4s12.7-2.6 12.7-8.4v-13.9h4.8c4.3 0 8.4-5.8 8.4-11.9 0-5.7-2.6-11.9-8.4-11.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 507 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/telephone-3.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M402.4 437.9c0-10.5-4.4-20.4-12.6-28.7-5.1-5.6-10.6-11-16-16.1-2.7-2.6-5.5-5.3-8.1-8l-23.4-23.4c-18-18-41.3-18-59.4 0-2.4 2.4-4.9 4.8-7.3 7.2-6.4 6.4-13.1 12.9-19.6 19.9-11.6-5.2-23-12.4-36.5-23.2-13.4-10.9-62.2-59.7-73.2-73.2-10.7-13.5-17.9-25-23.2-36.5 7-6.4 13.5-13.1 19.9-19.6 2.4-2.4 4.8-4.9 7.2-7.3 18-18 18-41.3 0-59.4l-23.4-23.4c-2.7-2.7-5.4-5.4-8-8.1-5.2-5.3-10.6-10.8-16.1-16-8.3-8.2-18.3-12.6-28.7-12.6s-20.5 4.5-29.1 12.7l-.2.2L33.4 134c-10.8 10.6-17.4 24.8-18.6 39.9-2.1 25 5.3 48.4 11 63.6C39.6 275 60.4 309.7 91.3 347c11.2 13.3 23.2 26 35.9 37.8 11.8 12.7 24.4 24.7 37.8 35.8 37.2 31 72 51.7 109.5 65.6 15.3 5.7 38.6 13 63.6 11 15.1-1.2 29.3-7.8 39.9-18.6l11.6-11.4.2-.2c8.2-8.5 12.6-18.6 12.6-29.1z"></path><path class="lineal-stroke" d="M507 237.1C507 106.4 400.7 0 270 0c-54.9 0-108.2 19.1-150.6 54-6.1 5.1-7 14.2-1.9 20.3 5.1 6.1 14.1 7 20.2 2 37.3-30.6 84-47.4 132.3-47.4 114.9 0 208.3 93.4 208.3 208.3-.1 63.1-28.7 122.8-77.8 162.4l-.2-.2c-5.4-5.8-11.1-11.4-16.4-16.5l-.2-.1c-2.5-2.3-5-4.8-7.4-7.3l-23.8-23.8c-11.6-11.6-25.4-17.7-39.9-17.7s-28.3 6.1-39.9 17.7l-3.4 3.4c-1.1 1.1-2.6 2.5-3.8 3.7l-1.8 1.7c-3.5 3.5-7.1 7-10.8 10.7-8.6-4.9-16.8-10.5-24.4-16.7-12.9-10.5-60.4-58.1-71-71-6.2-7.7-11.8-15.8-16.8-24.4 3.7-3.6 7.2-7.2 10.7-10.7l1.7-1.8c1.3-1.3 2.6-2.6 3.8-3.9 1.1-1.1 2.2-2.3 3.4-3.4 23.5-23.5 23.5-56.2 0-79.7L149 148.3c4.5-6.1 9.4-11.8 14.8-17.1 58.5-58.5 153.6-58.5 212 0 44.9 45 56.6 113.4 29.3 170.8-3.4 7.2-.4 15.8 6.8 19.2s15.8.4 19.2-6.8c32.6-68.4 18.7-149.9-34.9-203.5-69.7-69.7-183.1-69.7-252.7 0-5.3 5.3-10.3 10.9-14.9 16.8-5-5.2-10.3-10.6-16-15.8-10.9-11-24.3-16.7-38.6-16.7s-27.8 5.7-39.1 16.6l-.2.2-.2.2-.1.1-11.3 11.6C9.9 136.9 1.8 154.2.4 172.7c-2.3 27.8 5.7 53.2 11.8 69.8 14.5 39.2 36.1 75.3 68.1 113.7C91.7 369.9 104 382.8 117 395c12.2 13 25.1 25.3 38.8 36.8 38.4 31.9 74.5 53.5 113.6 68 14.2 5.2 35.8 12.2 60 12.2 3.3 0 6.7-.1 10-.4 18.5-1.5 35.8-9.5 48.7-22.7l11.6-11.3.1-.1.2-.2.2-.2c10.9-11.3 16.6-24.9 16.6-39.1 0-4.5-.6-9-1.8-13.4 58-45 91.9-114.2 92-187.5zM379.5 457L368 468.4l-.1.1c-8.2 8.4-19.2 13.6-30.9 14.4-2.5.2-5 .3-7.5.3-19.5 0-37.8-6-49.9-10.4-36-13.4-69.5-33.4-105.2-63.1-12.9-10.8-25.1-22.3-36.6-34.6-.2-.3-.5-.5-.7-.7-12.3-11.4-23.8-23.6-34.6-36.5-29.8-35.9-49.9-69.4-63.3-105.4-5.2-14.1-11.9-35.3-10.1-57.4.9-11.8 6-22.8 14.5-31l.1-.1L55 132.5c5.8-5.6 12.4-8.5 19.1-8.5s13 2.9 18.6 8.4l.4.4c5.3 4.9 10.6 10.3 15.5 15.3 2.6 2.7 5.2 5.4 7.8 8l23.8 23.8c12.4 12.4 12.4 26.6 0 39l-3.6 3.6c-1.2 1.2-2.4 2.5-3.7 3.8l-1.9 1.8c-5.6 5.7-11.5 11.6-17.6 17.2-4.6 4.2-6 10.9-3.4 16.5 5.7 12.7 13.7 25.2 25 39.5l.1.2c11.7 14.4 60.9 63.6 75.3 75.3l.1.1c14.3 11.3 26.9 19.3 39.5 25 5.7 2.6 12.3 1.2 16.5-3.4 5.6-6.1 11.5-12 17.3-17.6l1.9-1.8c1.2-1.2 2.4-2.4 3.7-3.6s2.4-2.4 3.6-3.6c6.1-6.1 12.8-9.3 19.5-9.3s13.4 3.2 19.5 9.3l23.8 23.8c2.6 2.6 5.3 5.2 8 7.8 5 4.9 10.4 10.1 15.3 15.5l.4.4c3.9 3.9 8.4 10.3 8.4 18.6.1 6.6-2.8 13.2-8.4 19z"></path><path class="lineal-stroke" d="M274.8 258.4h-36.5c.1-4.4 6.9-9 14.7-14.3 13.4-9.2 30-20.6 30-40.4 0-20.4-18.1-31.4-35.1-31.4-16.6 0-34.1 10.2-34.1 29.2 0 8.7 3.9 13.2 11.6 13.2 8.6 0 13.3-5 13.3-9.7 0-7.8 5.1-9.4 9.4-9.4 7.1 0 9.6 4.8 9.6 8.8 0 8-9.9 15.2-20.4 22.9-12.4 9.1-25.2 18.5-25.2 31.2v14c0 5.2 6.6 8.4 11.3 8.4h51.5c4.4 0 8.2-5.3 8.2-11.4s-3.8-11.1-8.3-11.1z"></path><path class="lineal-stroke" d="M351.9 234.9h-4.8v-8.7c0-5-5-8.2-12.7-8.2s-12.7 3.2-12.7 8.2v8.7H313l24.6-49.3c.5-1 .8-2.2.8-3.3 0-6.2-8.2-10-12.7-10-4.6-.1-8.8 2.5-10.7 6.6l-33.4 65.5c-.8 1.5-1.3 3.2-1.3 5 0 5.5 3.6 9.3 9 9.3h32.4v13.9c0 5.8 6.6 8.4 12.7 8.4s12.7-2.6 12.7-8.4v-13.9h4.8c4.3 0 8.4-5.8 8.4-11.9 0-5.7-2.6-11.9-8.4-11.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">telephone-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telephone-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/telephone-3.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 484.6 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/television.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M67.1 404.7V198.5c0-8.6 7-15.6 15.6-15.6h239.7c8.6 0 15.6 7 15.6 15.6v206.2c0 8.6-7 15.6-15.6 15.6H82.7c-8.6 0-15.6-7-15.6-15.6z"></path><path class="lineal-stroke" d="M322.4 434.4H82.7c-16.4 0-29.7-13.3-29.7-29.7V198.5c0-16.4 13.3-29.7 29.7-29.7h239.7c16.4 0 29.7 13.3 29.7 29.7v206.2c0 16.4-13.3 29.7-29.7 29.7zM82.7 196.9c-.9 0-1.5.7-1.6 1.5v206.2c0 .9.7 1.6 1.5 1.6h239.7c.9 0 1.6-.7 1.6-1.6V198.5c0-.9-.7-1.6-1.6-1.6H82.7zm322.7 237.5c-23.1.4-42.2-18.1-42.5-41.2-.4-23.1 18.1-42.2 41.2-42.5h1.3c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1c-7.6 0-13.7 6.1-13.7 13.7s6.1 13.7 13.7 13.7 13.7-6.1 13.7-13.7c0-7.8 6.3-14.1 14.1-14.1s14.1 6.3 14.1 14.1c0 23-18.8 41.8-41.9 41.8zm16.6-111h-33.1c-7.8 0-14.1-6.3-14.1-14.1s6.3-14.1 14.1-14.1H422c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1zm0-50h-33.1c-7.8 0-14.1-6.3-14.1-14.1s6.3-14.1 14.1-14.1H422c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1zm0-50h-33.1c-7.8 0-14.1-6.3-14.1-14.1s6.3-14.1 14.1-14.1H422c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1z"></path><path class="lineal-stroke" d="M336.6 459.2H28.2V143.9h116.3c7.8 0 14.1-6.3 14.1-14.1s-6.3-14.1-14.1-14.1H14.1C6.3 115.7 0 122 0 129.8v343.5c0 7.8 6.3 14.1 14.1 14.1h30.1v10.5c.2 7.8 6.7 13.9 14.5 13.7 7.5-.2 13.5-6.2 13.7-13.7v-10.5h264.3c7.8 0 14.1-6.3 14.1-14.1-.1-7.8-6.4-14.1-14.2-14.1zm133.9-343.4H272.7L364.2 24c5.7-5.3 6-14.2.7-19.9-5.3-5.7-14.2-6-19.9-.7l-.7.7-105.5 105.8-78-78.3c-5.5-5.5-14.4-5.5-19.9-.1-5.5 5.5-5.5 14.4-.1 19.9l88 88.3.1.1c.3.3.6.5.9.8l.5.4.6.4h.1l.6.3.6.3.1.1.6.3.6.3h.1l.6.2c.2.1.4.2.6.2h.1c.2.1.4.1.6.1l.7.2h.1c.2.1.5.1.7.1s.4.1.6.1c.5 0 .9.1 1.4.1h217.8V459h-30.1c-7.8 0-14.1 6.3-14.1 14.1v24.6c0 7.8 6.3 14.1 14.1 14.1s14.1-6.3 14.1-14.1v-10.3h30.1c7.8 0 14.1-6.3 14.1-14.1V129.8c-.4-7.7-6.7-14-14.5-14z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 484.6 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/television.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M67.1 404.7V198.5c0-8.6 7-15.6 15.6-15.6h239.7c8.6 0 15.6 7 15.6 15.6v206.2c0 8.6-7 15.6-15.6 15.6H82.7c-8.6 0-15.6-7-15.6-15.6z"></path><path class="lineal-stroke" d="M322.4 434.4H82.7c-16.4 0-29.7-13.3-29.7-29.7V198.5c0-16.4 13.3-29.7 29.7-29.7h239.7c16.4 0 29.7 13.3 29.7 29.7v206.2c0 16.4-13.3 29.7-29.7 29.7zM82.7 196.9c-.9 0-1.5.7-1.6 1.5v206.2c0 .9.7 1.6 1.5 1.6h239.7c.9 0 1.6-.7 1.6-1.6V198.5c0-.9-.7-1.6-1.6-1.6H82.7zm322.7 237.5c-23.1.4-42.2-18.1-42.5-41.2-.4-23.1 18.1-42.2 41.2-42.5h1.3c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1c-7.6 0-13.7 6.1-13.7 13.7s6.1 13.7 13.7 13.7 13.7-6.1 13.7-13.7c0-7.8 6.3-14.1 14.1-14.1s14.1 6.3 14.1 14.1c0 23-18.8 41.8-41.9 41.8zm16.6-111h-33.1c-7.8 0-14.1-6.3-14.1-14.1s6.3-14.1 14.1-14.1H422c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1zm0-50h-33.1c-7.8 0-14.1-6.3-14.1-14.1s6.3-14.1 14.1-14.1H422c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1zm0-50h-33.1c-7.8 0-14.1-6.3-14.1-14.1s6.3-14.1 14.1-14.1H422c7.8 0 14.1 6.3 14.1 14.1s-6.3 14.1-14.1 14.1z"></path><path class="lineal-stroke" d="M336.6 459.2H28.2V143.9h116.3c7.8 0 14.1-6.3 14.1-14.1s-6.3-14.1-14.1-14.1H14.1C6.3 115.7 0 122 0 129.8v343.5c0 7.8 6.3 14.1 14.1 14.1h30.1v10.5c.2 7.8 6.7 13.9 14.5 13.7 7.5-.2 13.5-6.2 13.7-13.7v-10.5h264.3c7.8 0 14.1-6.3 14.1-14.1-.1-7.8-6.4-14.1-14.2-14.1zm133.9-343.4H272.7L364.2 24c5.7-5.3 6-14.2.7-19.9-5.3-5.7-14.2-6-19.9-.7l-.7.7-105.5 105.8-78-78.3c-5.5-5.5-14.4-5.5-19.9-.1-5.5 5.5-5.5 14.4-.1 19.9l88 88.3.1.1c.3.3.6.5.9.8l.5.4.6.4h.1l.6.3.6.3.1.1.6.3.6.3h.1l.6.2c.2.1.4.2.6.2h.1c.2.1.4.1.6.1l.7.2h.1c.2.1.5.1.7.1s.4.1.6.1c.5 0 .9.1 1.4.1h217.8V459h-30.1c-7.8 0-14.1 6.3-14.1 14.1v24.6c0 7.8 6.3 14.1 14.1 14.1s14.1-6.3 14.1-14.1v-10.3h30.1c7.8 0 14.1-6.3 14.1-14.1V129.8c-.4-7.7-6.7-14-14.5-14z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">television</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/television.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/television.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 373.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/tie.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M321.5 13.4L186.9 64l79.3 104.4 94.1-106.2-38.8-48.8zM13.4 62.2l94.1 106.2L186.9 64 52.3 13.4 13.4 62.2z"></path><path class="lineal-stroke" d="M370.9 53.9L332 5.1c-3.6-4.5-9.8-6.2-15.2-4.2L186.9 49.7 57 .9c-5.5-2-11.6-.4-15.2 4.2L2.9 53.9c-4 5.1-3.8 12.4.5 17.3l94.1 106.2c2.5 2.9 6.2 4.5 10 4.5h.5c4-.2 7.8-2.1 10.2-5.3l4.9-6.4 22.8 26.1-40.3 244.8c-.8 4.8 1 9.6 4.8 12.6l68.1 55.3c4.9 4 12 4 16.9 0l68.1-55.3c3.7-3 5.6-7.9 4.8-12.6l-26.9-163.3c0-.1 0-.1-.1-.2-.1-.3-.1-.5-.2-.8s-.1-.4-.1-.5-.1-.5-.2-.7-.1-.4-.2-.6l-.3-.6-.3-.6c-.1-.2-.2-.4-.3-.5s-.2-.4-.4-.6l-.3-.5-.4-.6-.4-.5c-.1-.2-.3-.3-.5-.5l-.5-.5c-.2-.2-.3-.3-.5-.4l-.6-.4c-.1-.1-.3-.2-.4-.3s-.4-.3-.6-.4l-.4-.3c-.2-.1-.5-.2-.7-.4l-.4-.2-.7-.3-.5-.2-.7-.2c-.2 0-.4-.1-.6-.1s-.4-.1-.6-.1l-.7-.1H194c-7.4 0-13.4 6-13.4 13.4s6 13.4 13.4 13.4h22.8l23.8 144.4-53.6 43.5-53.6-43.5 38.4-233.1h42.8c3.9 0 7.6-1.7 10.1-4.6l26.1-29.9 4.9 6.4c2.4 3.2 6.2 5.1 10.2 5.3h.5c3.8 0 7.5-1.7 10-4.5l94.2-106.2c4.2-5 4.4-12.3.3-17.4zm-264.1 93.4L31 61.8l25.7-32.3 108.6 40.8-58.5 77zm101.6 30.5h-43l-25.7-29.5 47.2-62.1 47.2 62.1-25.7 29.5zm58.7-30.5l-58.6-77 108.6-40.9 25.8 32.3-75.8 85.6z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 373.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/tie.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M321.5 13.4L186.9 64l79.3 104.4 94.1-106.2-38.8-48.8zM13.4 62.2l94.1 106.2L186.9 64 52.3 13.4 13.4 62.2z"></path><path class="lineal-stroke" d="M370.9 53.9L332 5.1c-3.6-4.5-9.8-6.2-15.2-4.2L186.9 49.7 57 .9c-5.5-2-11.6-.4-15.2 4.2L2.9 53.9c-4 5.1-3.8 12.4.5 17.3l94.1 106.2c2.5 2.9 6.2 4.5 10 4.5h.5c4-.2 7.8-2.1 10.2-5.3l4.9-6.4 22.8 26.1-40.3 244.8c-.8 4.8 1 9.6 4.8 12.6l68.1 55.3c4.9 4 12 4 16.9 0l68.1-55.3c3.7-3 5.6-7.9 4.8-12.6l-26.9-163.3c0-.1 0-.1-.1-.2-.1-.3-.1-.5-.2-.8s-.1-.4-.1-.5-.1-.5-.2-.7-.1-.4-.2-.6l-.3-.6-.3-.6c-.1-.2-.2-.4-.3-.5s-.2-.4-.4-.6l-.3-.5-.4-.6-.4-.5c-.1-.2-.3-.3-.5-.5l-.5-.5c-.2-.2-.3-.3-.5-.4l-.6-.4c-.1-.1-.3-.2-.4-.3s-.4-.3-.6-.4l-.4-.3c-.2-.1-.5-.2-.7-.4l-.4-.2-.7-.3-.5-.2-.7-.2c-.2 0-.4-.1-.6-.1s-.4-.1-.6-.1l-.7-.1H194c-7.4 0-13.4 6-13.4 13.4s6 13.4 13.4 13.4h22.8l23.8 144.4-53.6 43.5-53.6-43.5 38.4-233.1h42.8c3.9 0 7.6-1.7 10.1-4.6l26.1-29.9 4.9 6.4c2.4 3.2 6.2 5.1 10.2 5.3h.5c3.8 0 7.5-1.7 10-4.5l94.2-106.2c4.2-5 4.4-12.3.3-17.4zm-264.1 93.4L31 61.8l25.7-32.3 108.6 40.8-58.5 77zm101.6 30.5h-43l-25.7-29.5 47.2-62.1 47.2 62.1-25.7 29.5zm58.7-30.5l-58.6-77 108.6-40.9 25.8 32.3-75.8 85.6z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">tie</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/tie.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/tie.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.81 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/tools.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M265.14 154.996l139.278-139.28 91.86 91.861L357 246.856zM14.517 405.61l171.509-171.508 91.86 91.86-171.509 171.509z"></path><path class="lineal-stroke" d="M45.57 94.3A14.53 14.53 0 0135.3 69.5l65.24-65.25a14.53 14.53 0 0120.55 20.55L55.85 90.05a14.52 14.52 0 01-10.28 4.25z"></path><path class="lineal-fill" d="M70.473 118.543l79.104-79.104 60.627 60.628L131.1 179.17z"></path><path class="lineal-stroke" d="M442.61 181.8l63.94-64a14.53 14.53 0 000-20.54L414.69 5.44a14.54 14.54 0 00-20.55 0l-129 129-44.65-44.65-60.63-60.63c-.35-.34-.71-.67-1.08-1a9.41 9.41 0 00-.81-.6l-.34-.25c-.33-.22-.68-.42-1-.62l-.19-.11c-.35-.19-.71-.35-1.07-.51l-.21-.09c-.34-.14-.69-.26-1-.37l-.31-.11c-.3-.1-.62-.17-.93-.24l-.45-.11-.8-.12L151 25h-1.41c-.26 0-.54 0-.82.05h-.58l-.69.1c-.24 0-.48.06-.72.11l-.54.13c-.29.07-.57.13-.84.22l-.41.14c-.32.1-.63.21-.94.33l-.31.15c-.33.14-.65.29-1 .46-.11.05-.22.13-.33.19-.3.17-.6.34-.89.53s-.35.26-.53.39-.42.3-.62.46a12.56 12.56 0 00-1.08 1L60.2 108.27a14.54 14.54 0 00-4 7.42 14.27 14.27 0 00-.28 2.85 14.53 14.53 0 004.25 10.27l60.64 60.64 44.65 44.65L4.26 395.33a14.52 14.52 0 000 20.55l91.86 91.86a14.52 14.52 0 0020.55 0L277.9 346.51 388 456.6a14.57 14.57 0 0010 4.26l80.65 1.54h.28a14.53 14.53 0 00.27-29l-74.79-1.44-252.75-252.79 58.55-58.56 44.65 44.65 91.86 91.86L467.1 377.5a14.53 14.53 0 1020.55-20.5L377.56 246.86l65-65.05zM106.39 476.92L35.08 405.6l151-151 19.81 19.81 17.11 17.2a14.52 14.52 0 00-17.73 22.73l31.85 31.85L170.34 413l-31.85-31.85a14.53 14.53 0 10-20.55 20.55l31.85 31.85zm24.72-318.3L91 118.54 149.58 60l40.09 40.09zM285.69 155L404.42 36.26l71.31 71.32L432.34 151l-31.85-31.85a14.53 14.53 0 00-20.55 20.55l31.85 31.85L357 226.31z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 510.81 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/tools.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M265.14 154.996l139.278-139.28 91.86 91.861L357 246.856zM14.517 405.61l171.509-171.508 91.86 91.86-171.509 171.509z"></path><path class="lineal-stroke" d="M45.57 94.3A14.53 14.53 0 0135.3 69.5l65.24-65.25a14.53 14.53 0 0120.55 20.55L55.85 90.05a14.52 14.52 0 01-10.28 4.25z"></path><path class="lineal-fill" d="M70.473 118.543l79.104-79.104 60.627 60.628L131.1 179.17z"></path><path class="lineal-stroke" d="M442.61 181.8l63.94-64a14.53 14.53 0 000-20.54L414.69 5.44a14.54 14.54 0 00-20.55 0l-129 129-44.65-44.65-60.63-60.63c-.35-.34-.71-.67-1.08-1a9.41 9.41 0 00-.81-.6l-.34-.25c-.33-.22-.68-.42-1-.62l-.19-.11c-.35-.19-.71-.35-1.07-.51l-.21-.09c-.34-.14-.69-.26-1-.37l-.31-.11c-.3-.1-.62-.17-.93-.24l-.45-.11-.8-.12L151 25h-1.41c-.26 0-.54 0-.82.05h-.58l-.69.1c-.24 0-.48.06-.72.11l-.54.13c-.29.07-.57.13-.84.22l-.41.14c-.32.1-.63.21-.94.33l-.31.15c-.33.14-.65.29-1 .46-.11.05-.22.13-.33.19-.3.17-.6.34-.89.53s-.35.26-.53.39-.42.3-.62.46a12.56 12.56 0 00-1.08 1L60.2 108.27a14.54 14.54 0 00-4 7.42 14.27 14.27 0 00-.28 2.85 14.53 14.53 0 004.25 10.27l60.64 60.64 44.65 44.65L4.26 395.33a14.52 14.52 0 000 20.55l91.86 91.86a14.52 14.52 0 0020.55 0L277.9 346.51 388 456.6a14.57 14.57 0 0010 4.26l80.65 1.54h.28a14.53 14.53 0 00.27-29l-74.79-1.44-252.75-252.79 58.55-58.56 44.65 44.65 91.86 91.86L467.1 377.5a14.53 14.53 0 1020.55-20.5L377.56 246.86l65-65.05zM106.39 476.92L35.08 405.6l151-151 19.81 19.81 17.11 17.2a14.52 14.52 0 00-17.73 22.73l31.85 31.85L170.34 413l-31.85-31.85a14.53 14.53 0 10-20.55 20.55l31.85 31.85zm24.72-318.3L91 118.54 149.58 60l40.09 40.09zM285.69 155L404.42 36.26l71.31 71.32L432.34 151l-31.85-31.85a14.53 14.53 0 00-20.55 20.55l31.85 31.85L357 226.31z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">tools</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/tools.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/tools.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 362.06 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/touch-screen.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M180.94 362.11a181.72 181.72 0 01-112.59-39.29C-9.81 260.71-22.88 146.59 39.22 68.43a181.06 181.06 0 01300.91 199.05 11.88 11.88 0 11-20.86-11.39A157.39 157.39 0 00278.82 57.9a157.3 157.3 0 00-221 25.31c-53.95 67.91-42.6 167 25.3 221a157.9 157.9 0 0097.81 34.14 11.88 11.88 0 110 23.76z"></path><path class="lineal-stroke" d="M180.94 308.64A128 128 0 01101.61 281c-55.07-43.81-64.29-124.23-20.52-179.31a127.65 127.65 0 01222.53 114.76 11.88 11.88 0 01-22.83-6.59 103.87 103.87 0 10-99.85 75 11.88 11.88 0 010 23.76z"></path><path class="lineal-fill" d="M243.21 181.06A62.23 62.23 0 11181 118.82a62.23 62.23 0 0162.23 62.24z"></path><path class="lineal-stroke" d="M180.94 255.17a74.11 74.11 0 1158.07-28 74.28 74.28 0 01-58.07 28zm.06-124.46a50.35 50.35 0 1031.28 10.93A50.14 50.14 0 00181 130.71z"></path><path class="lineal-fill" d="M258.69 397.72a30.53 30.53 0 0030.53-30.53v-78.08A41.2 41.2 0 00248 247.9l-41.74-.08v-61c0-12.89-10-23.87-22.89-24.32a23.77 23.77 0 00-24.64 23.75v106.62l-6.23-13c-3.4-7.09-9.81-11.12-16.42-11.12a16.9 16.9 0 00-9 2.64c-9.06 5.68-12.39 18.67-7.41 29 0 0 20.56 48.15 35.25 79.68a30.5 30.5 0 0027.66 17.63z"></path><path class="lineal-stroke" d="M258.69 409.6h-76.08a42.56 42.56 0 01-38.44-24.49c-14.09-30.26-33.77-76.22-35.31-79.81-7.44-15.82-2.23-35.09 11.93-44a29 29 0 0115.3-4.45 28.63 28.63 0 0110.77 2.15v-72.79a35.69 35.69 0 0136.94-35.63c19.27.69 34.36 16.58 34.36 36.2V236H248a53.14 53.14 0 0153.07 53.09v78.08a42.46 42.46 0 01-42.41 42.41zm-122.6-129a5.09 5.09 0 00-2.69.83c-3.93 2.46-5.34 8.92-3 13.8l.22.48c.2.48 20.65 48.33 35.09 79.32a18.7 18.7 0 0016.89 10.77h76.08a18.68 18.68 0 0018.65-18.65v-78.04A29.36 29.36 0 00248 259.78l-41.76-.08a11.88 11.88 0 01-11.86-11.88v-61c0-6.63-5.13-12.21-11.44-12.44a11.86 11.86 0 00-12.32 11.87v106.62A11.88 11.88 0 01148 298l-6.24-13c-1.29-2.7-3.47-4.37-5.7-4.37z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 362.06 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/touch-screen.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M180.94 362.11a181.72 181.72 0 01-112.59-39.29C-9.81 260.71-22.88 146.59 39.22 68.43a181.06 181.06 0 01300.91 199.05 11.88 11.88 0 11-20.86-11.39A157.39 157.39 0 00278.82 57.9a157.3 157.3 0 00-221 25.31c-53.95 67.91-42.6 167 25.3 221a157.9 157.9 0 0097.81 34.14 11.88 11.88 0 110 23.76z"></path><path class="lineal-stroke" d="M180.94 308.64A128 128 0 01101.61 281c-55.07-43.81-64.29-124.23-20.52-179.31a127.65 127.65 0 01222.53 114.76 11.88 11.88 0 01-22.83-6.59 103.87 103.87 0 10-99.85 75 11.88 11.88 0 010 23.76z"></path><path class="lineal-fill" d="M243.21 181.06A62.23 62.23 0 11181 118.82a62.23 62.23 0 0162.23 62.24z"></path><path class="lineal-stroke" d="M180.94 255.17a74.11 74.11 0 1158.07-28 74.28 74.28 0 01-58.07 28zm.06-124.46a50.35 50.35 0 1031.28 10.93A50.14 50.14 0 00181 130.71z"></path><path class="lineal-fill" d="M258.69 397.72a30.53 30.53 0 0030.53-30.53v-78.08A41.2 41.2 0 00248 247.9l-41.74-.08v-61c0-12.89-10-23.87-22.89-24.32a23.77 23.77 0 00-24.64 23.75v106.62l-6.23-13c-3.4-7.09-9.81-11.12-16.42-11.12a16.9 16.9 0 00-9 2.64c-9.06 5.68-12.39 18.67-7.41 29 0 0 20.56 48.15 35.25 79.68a30.5 30.5 0 0027.66 17.63z"></path><path class="lineal-stroke" d="M258.69 409.6h-76.08a42.56 42.56 0 01-38.44-24.49c-14.09-30.26-33.77-76.22-35.31-79.81-7.44-15.82-2.23-35.09 11.93-44a29 29 0 0115.3-4.45 28.63 28.63 0 0110.77 2.15v-72.79a35.69 35.69 0 0136.94-35.63c19.27.69 34.36 16.58 34.36 36.2V236H248a53.14 53.14 0 0153.07 53.09v78.08a42.46 42.46 0 01-42.41 42.41zm-122.6-129a5.09 5.09 0 00-2.69.83c-3.93 2.46-5.34 8.92-3 13.8l.22.48c.2.48 20.65 48.33 35.09 79.32a18.7 18.7 0 0016.89 10.77h76.08a18.68 18.68 0 0018.65-18.65v-78.04A29.36 29.36 0 00248 259.78l-41.76-.08a11.88 11.88 0 01-11.86-11.88v-61c0-6.63-5.13-12.21-11.44-12.44a11.86 11.86 0 00-12.32 11.87v106.62A11.88 11.88 0 01148 298l-6.24-13c-1.29-2.7-3.47-4.37-5.7-4.37z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">touch-screen</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/touch-screen.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/touch-screen.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 338.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/truck.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><circle class="lineal-fill" cx="106.1" cy="275.9" r="48.2"></circle><path class="lineal-fill" d="M261.3 22.6V269h70.5c3.8-26.3 28.2-44.6 54.5-40.8 21.2 3 37.8 19.7 40.8 40.8h70.7V22.6H261.3z"></path><path class="lineal-stroke" d="M497.8 8.4H261.3c-7.8 0-14.2 6.3-14.2 14.2v232.3h-34.5v-71.7c0-7.8-6.4-14.2-14.2-14.2s-14.2 6.3-14.2 14.2v71.7h-19.4c-11.6-32.4-47.3-49.3-79.8-37.6-17.5 6.3-31.3 20.1-37.6 37.6h-9.5c-5.3 0-9.6-4.3-9.6-9.6v-47.5c0-2.8 1.3-5.5 3.4-7.4.3-.2.5-.4.8-.7l34.3-33.3h51.9c7.8-.2 14-6.7 13.8-14.5-.2-7.5-6.3-13.6-13.8-13.8H79.8l25.8-67.9c8.8-19.3 28-31.8 49.2-31.9l29.4.1v57.4c0 7.8 6.3 14.2 14.2 14.2 7.8 0 14.2-6.3 14.2-14.2V14.3c0-7.8-6.3-14.1-14.1-14.2L154.8 0c-32.5.1-62 19.3-75.3 49-.1.2-.2.5-.3.7l-33.1 87.2L13 169c-8.2 7.3-13 17.8-13 28.8v47.5c0 20.9 17 37.9 37.9 37.9h6.2c4 34.2 35 58.7 69.2 54.6 28.7-3.4 51.3-26 54.6-54.6h149.5c3.7 31.4 30.3 55 61.9 55.1 7.8 0 14.2-6.3 14.2-14.2 0-7.8-6.3-14.2-14.2-14.2-18.8 0-34-15.2-34-34 0-1.7.1-3.3.4-4.9.1-1 .3-1.9.6-2.9l.1-.3c.2-.9.5-1.8.8-2.7 0-.1.1-.2.1-.3.3-.9.6-1.8 1-2.6 0 0 0-.1.1-.2 4.6-10.2 13.9-17.5 24.9-19.6h.1c1-.2 2-.3 2.9-.4h.2c1-.1 2-.1 3-.1s2 .1 3 .1h.2c1 .1 2 .2 3 .4h.1c11 2.1 20.3 9.4 24.9 19.6l.1.1c.4.9.7 1.7 1 2.6 0 .1.1.2.1.3.3.9.6 1.8.8 2.7l.1.3c.2 1 .4 1.9.5 2.9.2 1.6.4 3.3.4 4.9 0 7.8 6.3 14.2 14.1 14.2 5 0 9.6-2.6 12.2-6.9h58.1c7.8 0 14.2-6.3 14.2-14.2V22.6c-.3-7.8-6.6-14.2-14.5-14.2zM106.1 309.9c-18.8 0-34-15.2-34-34s15.2-34 34-34 34 15.2 34 34-15.2 34-34 34zm377.6-55.1h-45.6c-.2-.7-.5-1.4-.8-2.1l-.1-.2-.9-2.1v-.1c-8.9-19.7-27.3-33.4-48.8-36.3l-1.1-.1-1.4-.1-1.7-.1c-.4 0-.7-.1-1.1-.1-1-.1-1.9-.1-2.9-.1s-1.9 0-2.9.1c-.4 0-.7 0-1.1.1l-1.7.1-1.4.1-1.1.1c-21.4 2.8-39.9 16.5-48.8 36.2v.1l-.9 2.1-.1.3c-.3.7-.5 1.3-.8 2h-45.3v-218h208.2v218.1h.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 338.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/truck.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><circle class="lineal-fill" cx="106.1" cy="275.9" r="48.2"></circle><path class="lineal-fill" d="M261.3 22.6V269h70.5c3.8-26.3 28.2-44.6 54.5-40.8 21.2 3 37.8 19.7 40.8 40.8h70.7V22.6H261.3z"></path><path class="lineal-stroke" d="M497.8 8.4H261.3c-7.8 0-14.2 6.3-14.2 14.2v232.3h-34.5v-71.7c0-7.8-6.4-14.2-14.2-14.2s-14.2 6.3-14.2 14.2v71.7h-19.4c-11.6-32.4-47.3-49.3-79.8-37.6-17.5 6.3-31.3 20.1-37.6 37.6h-9.5c-5.3 0-9.6-4.3-9.6-9.6v-47.5c0-2.8 1.3-5.5 3.4-7.4.3-.2.5-.4.8-.7l34.3-33.3h51.9c7.8-.2 14-6.7 13.8-14.5-.2-7.5-6.3-13.6-13.8-13.8H79.8l25.8-67.9c8.8-19.3 28-31.8 49.2-31.9l29.4.1v57.4c0 7.8 6.3 14.2 14.2 14.2 7.8 0 14.2-6.3 14.2-14.2V14.3c0-7.8-6.3-14.1-14.1-14.2L154.8 0c-32.5.1-62 19.3-75.3 49-.1.2-.2.5-.3.7l-33.1 87.2L13 169c-8.2 7.3-13 17.8-13 28.8v47.5c0 20.9 17 37.9 37.9 37.9h6.2c4 34.2 35 58.7 69.2 54.6 28.7-3.4 51.3-26 54.6-54.6h149.5c3.7 31.4 30.3 55 61.9 55.1 7.8 0 14.2-6.3 14.2-14.2 0-7.8-6.3-14.2-14.2-14.2-18.8 0-34-15.2-34-34 0-1.7.1-3.3.4-4.9.1-1 .3-1.9.6-2.9l.1-.3c.2-.9.5-1.8.8-2.7 0-.1.1-.2.1-.3.3-.9.6-1.8 1-2.6 0 0 0-.1.1-.2 4.6-10.2 13.9-17.5 24.9-19.6h.1c1-.2 2-.3 2.9-.4h.2c1-.1 2-.1 3-.1s2 .1 3 .1h.2c1 .1 2 .2 3 .4h.1c11 2.1 20.3 9.4 24.9 19.6l.1.1c.4.9.7 1.7 1 2.6 0 .1.1.2.1.3.3.9.6 1.8.8 2.7l.1.3c.2 1 .4 1.9.5 2.9.2 1.6.4 3.3.4 4.9 0 7.8 6.3 14.2 14.1 14.2 5 0 9.6-2.6 12.2-6.9h58.1c7.8 0 14.2-6.3 14.2-14.2V22.6c-.3-7.8-6.6-14.2-14.5-14.2zM106.1 309.9c-18.8 0-34-15.2-34-34s15.2-34 34-34 34 15.2 34 34-15.2 34-34 34zm377.6-55.1h-45.6c-.2-.7-.5-1.4-.8-2.1l-.1-.2-.9-2.1v-.1c-8.9-19.7-27.3-33.4-48.8-36.3l-1.1-.1-1.4-.1-1.7-.1c-.4 0-.7-.1-1.1-.1-1-.1-1.9-.1-2.9-.1s-1.9 0-2.9.1c-.4 0-.7 0-1.1.1l-1.7.1-1.4.1-1.1.1c-21.4 2.8-39.9 16.5-48.8 36.2v.1l-.9 2.1-.1.3c-.3.7-.5 1.3-.8 2h-45.3v-218h208.2v218.1h.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">truck</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/truck.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/truck.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 385.59 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/upload.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M218.78 287.16V110.5h37.09L192.8 12.43l-63.08 98.07h37.09v176.66z"></path><path class="lineal-stroke" d="M218.78 299.59h-52a12.43 12.43 0 01-12.43-12.43V122.93h-24.63a12.42 12.42 0 01-10.45-19.15l63.07-98.07a12.43 12.43 0 0120.91 0l62.69 97.46a12.43 12.43 0 01-10.05 19.76h-24.68v164.23a12.43 12.43 0 01-12.43 12.43zm-39.54-24.86h27.11V110.5a12.44 12.44 0 0112.43-12.43h14.32l-40.3-62.66-40.3 62.66h14.31a12.43 12.43 0 0112.43 12.43z"></path><path class="lineal-stroke" d="M373.16 409.6H12.43A12.43 12.43 0 010 397.17v-289A12.44 12.44 0 0112.43 95.7h62.89a12.43 12.43 0 110 24.86H24.86v264.18h335.87V120.56h-50.46a12.43 12.43 0 010-24.86h62.89a12.43 12.43 0 0112.43 12.43v289a12.42 12.42 0 01-12.43 12.43z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 385.59 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/upload.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M218.78 287.16V110.5h37.09L192.8 12.43l-63.08 98.07h37.09v176.66z"></path><path class="lineal-stroke" d="M218.78 299.59h-52a12.43 12.43 0 01-12.43-12.43V122.93h-24.63a12.42 12.42 0 01-10.45-19.15l63.07-98.07a12.43 12.43 0 0120.91 0l62.69 97.46a12.43 12.43 0 01-10.05 19.76h-24.68v164.23a12.43 12.43 0 01-12.43 12.43zm-39.54-24.86h27.11V110.5a12.44 12.44 0 0112.43-12.43h14.32l-40.3-62.66-40.3 62.66h14.31a12.43 12.43 0 0112.43 12.43z"></path><path class="lineal-stroke" d="M373.16 409.6H12.43A12.43 12.43 0 010 397.17v-289A12.44 12.44 0 0112.43 95.7h62.89a12.43 12.43 0 110 24.86H24.86v264.18h335.87V120.56h-50.46a12.43 12.43 0 010-24.86h62.89a12.43 12.43 0 0112.43 12.43v289a12.42 12.42 0 01-12.43 12.43z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">upload</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/upload.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/upload.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">user</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/user.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/user.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 442.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M13.8 47.7v69.9h484.3V47.7c0-18.7-15.2-33.9-33.9-33.9H47.8c-18.8 0-34 15.2-34 33.9z"></path><path class="lineal-stroke" d="M498.3 195.6c-7.7 0-13.9 6.2-13.9 13.8v185.7c0 11.1-9 20.1-20.1 20.1H47.8c-11.1-.1-20.1-9-20.1-20.1V131.5h470.5c7.6 0 13.8-6.2 13.8-13.9V47.7C512 21.4 490.6 0 464.3 0H47.8C21.4 0 0 21.4 0 47.7v347.4c0 26.3 21.4 47.7 47.8 47.7h416.4c26.4 0 47.8-21.4 47.9-47.8V209.4c0-7.6-6.2-13.8-13.8-13.8zM275.6 27.7l-76.2 76.1H47.1l76.2-76.1h152.3zm154.3 76.1l54.4-54.4v54.4h-54.4zm36.8-75.9l-75.9 75.9H238.6l76.2-76.1h149.4c.9 0 1.7.1 2.5.2zm-439 19.2c.4-10.7 9.2-19.4 20.1-19.4h36.4L27.7 84.1v-37z"></path><path class="lineal-fill" d="M202.7 191.3L337 270.9l-134.3 79.6z"></path><path class="lineal-stroke" d="M202.7 364.4c-7.6 0-13.8-6.2-13.8-13.8V191.3c0-7.6 6.2-13.8 13.8-13.8 2.5 0 4.9.7 7.1 1.9L344 259c6.6 3.9 8.7 12.4 4.9 18.9-1.2 2-2.9 3.7-4.9 4.9l-134.2 79.7c-2.1 1.2-4.6 1.9-7.1 1.9zm13.9-148.8v110.7l93.3-55.3-93.3-55.4z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 442.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M13.8 47.7v69.9h484.3V47.7c0-18.7-15.2-33.9-33.9-33.9H47.8c-18.8 0-34 15.2-34 33.9z"></path><path class="lineal-stroke" d="M498.3 195.6c-7.7 0-13.9 6.2-13.9 13.8v185.7c0 11.1-9 20.1-20.1 20.1H47.8c-11.1-.1-20.1-9-20.1-20.1V131.5h470.5c7.6 0 13.8-6.2 13.8-13.9V47.7C512 21.4 490.6 0 464.3 0H47.8C21.4 0 0 21.4 0 47.7v347.4c0 26.3 21.4 47.7 47.8 47.7h416.4c26.4 0 47.8-21.4 47.9-47.8V209.4c0-7.6-6.2-13.8-13.8-13.8zM275.6 27.7l-76.2 76.1H47.1l76.2-76.1h152.3zm154.3 76.1l54.4-54.4v54.4h-54.4zm36.8-75.9l-75.9 75.9H238.6l76.2-76.1h149.4c.9 0 1.7.1 2.5.2zm-439 19.2c.4-10.7 9.2-19.4 20.1-19.4h36.4L27.7 84.1v-37z"></path><path class="lineal-fill" d="M202.7 191.3L337 270.9l-134.3 79.6z"></path><path class="lineal-stroke" d="M202.7 364.4c-7.6 0-13.8-6.2-13.8-13.8V191.3c0-7.6 6.2-13.8 13.8-13.8 2.5 0 4.9.7 7.1 1.9L344 259c6.6 3.9 8.7 12.4 4.9 18.9-1.2 2-2.9 3.7-4.9 4.9l-134.2 79.7c-2.1 1.2-4.6 1.9-7.1 1.9zm13.9-148.8v110.7l93.3-55.3-93.3-55.4z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">video</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 350.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-fill" d="M312.8 275H10.7v17.3c0 26.1 21.2 47.3 47.3 47.3h293.6c26.2 0 47.4-21.2 47.4-47.4V275M175.6 169.8v-57.3c0-3.3 2.7-5.9 5.9-5.9 1 0 2 .3 2.9.8l50.5 28.6c2.8 1.6 3.8 5.2 2.2 8.1-.5.9-1.3 1.7-2.2 2.2l-50.5 28.6c-2.8 1.6-6.4.6-8.1-2.2-.4-.9-.7-1.9-.7-2.9z"></path><path class="lineal-stroke" d="M181.5 186.4c-9.2 0-16.6-7.4-16.6-16.6v-57.3c0-9.2 7.4-16.6 16.5-16.6 2.9 0 5.7.7 8.2 2.2l50.5 28.6c8 4.5 10.8 14.6 6.2 22.6-1.5 2.6-3.6 4.8-6.2 6.2l-50.5 28.6c-2.4 1.5-5.2 2.3-8.1 2.3zm4.8-65.7v40.9l36.1-20.5-36.1-20.4z"></path><path class="lineal-stroke" d="M204.8 232.8c-49.5-.1-89.6-40.2-89.7-89.6.2-5.9 5.1-10.5 11-10.3 5.6.2 10.2 4.7 10.3 10.3 0 37.7 30.6 68.3 68.3 68.3s68.3-30.6 68.3-68.3-30.6-68.3-68.3-68.3c-5.9 0-10.7-4.8-10.7-10.7s4.8-10.7 10.7-10.7c49.5 0 89.7 40.1 89.7 89.6s-40.1 89.7-89.6 89.7z"></path><path class="lineal-stroke" d="M351.6 0H58C26 .1.1 26 0 58v234.3c.1 32 26 57.9 58 58h293.6c32 0 57.9-26 58-58V58c-.1-32-26-57.9-58-58zM58 329c-20.3 0-36.7-16.5-36.7-36.7v-6.6h60.9v10c0 5.9 4.8 10.7 10.7 10.7 5.9 0 10.7-4.8 10.7-10.7v-10h209.2c5.9 0 10.7-4.8 10.7-10.7s-4.8-10.7-10.7-10.7H103.6v-10.9c0-5.9-4.8-10.7-10.7-10.7-5.9 0-10.7 4.8-10.7 10.7v10.9H21.3V58c.1-20.3 16.5-36.7 36.7-36.7h293.6c20.3 0 36.7 16.4 36.7 36.7v234.3c0 7.6-2.3 14.7-6.3 20.5-1.3 2-2.8 3.8-4.5 5.4-.8.8-1.7 1.6-2.6 2.4-1.8 1.5-3.8 2.8-5.9 3.9-5.2 2.8-11.2 4.4-17.5 4.4H58z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 350.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video-2.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-fill" d="M312.8 275H10.7v17.3c0 26.1 21.2 47.3 47.3 47.3h293.6c26.2 0 47.4-21.2 47.4-47.4V275M175.6 169.8v-57.3c0-3.3 2.7-5.9 5.9-5.9 1 0 2 .3 2.9.8l50.5 28.6c2.8 1.6 3.8 5.2 2.2 8.1-.5.9-1.3 1.7-2.2 2.2l-50.5 28.6c-2.8 1.6-6.4.6-8.1-2.2-.4-.9-.7-1.9-.7-2.9z"></path><path class="lineal-stroke" d="M181.5 186.4c-9.2 0-16.6-7.4-16.6-16.6v-57.3c0-9.2 7.4-16.6 16.5-16.6 2.9 0 5.7.7 8.2 2.2l50.5 28.6c8 4.5 10.8 14.6 6.2 22.6-1.5 2.6-3.6 4.8-6.2 6.2l-50.5 28.6c-2.4 1.5-5.2 2.3-8.1 2.3zm4.8-65.7v40.9l36.1-20.5-36.1-20.4z"></path><path class="lineal-stroke" d="M204.8 232.8c-49.5-.1-89.6-40.2-89.7-89.6.2-5.9 5.1-10.5 11-10.3 5.6.2 10.2 4.7 10.3 10.3 0 37.7 30.6 68.3 68.3 68.3s68.3-30.6 68.3-68.3-30.6-68.3-68.3-68.3c-5.9 0-10.7-4.8-10.7-10.7s4.8-10.7 10.7-10.7c49.5 0 89.7 40.1 89.7 89.6s-40.1 89.7-89.6 89.7z"></path><path class="lineal-stroke" d="M351.6 0H58C26 .1.1 26 0 58v234.3c.1 32 26 57.9 58 58h293.6c32 0 57.9-26 58-58V58c-.1-32-26-57.9-58-58zM58 329c-20.3 0-36.7-16.5-36.7-36.7v-6.6h60.9v10c0 5.9 4.8 10.7 10.7 10.7 5.9 0 10.7-4.8 10.7-10.7v-10h209.2c5.9 0 10.7-4.8 10.7-10.7s-4.8-10.7-10.7-10.7H103.6v-10.9c0-5.9-4.8-10.7-10.7-10.7-5.9 0-10.7 4.8-10.7 10.7v10.9H21.3V58c.1-20.3 16.5-36.7 36.7-36.7h293.6c20.3 0 36.7 16.4 36.7 36.7v234.3c0 7.6-2.3 14.7-6.3 20.5-1.3 2-2.8 3.8-4.5 5.4-.8.8-1.7 1.6-2.6 2.4-1.8 1.5-3.8 2.8-5.9 3.9-5.2 2.8-11.2 4.4-17.5 4.4H58z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">video-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video-2.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 481.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video-camera.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M385.8 481.3H33.53A33.57 33.57 0 010 447.76v-228a33.57 33.57 0 0133.53-33.54H385.8a33.57 33.57 0 0133.53 33.54v135.55a15.39 15.39 0 01-30.78 0V219.75a2.76 2.76 0 00-2.75-2.75H33.53a2.76 2.76 0 00-2.75 2.76v228a2.76 2.76 0 002.75 2.76H385.8a15.39 15.39 0 010 30.78z"></path><path class="lineal-fill" d="M403.95 292v83.51l92.66 61.92V230.08L403.95 292z"></path><path class="lineal-stroke" d="M496.61 452.82a15.4 15.4 0 01-8.55-2.59l-92.67-61.92a15.41 15.41 0 01-6.84-12.8V292a15.38 15.38 0 016.84-12.79l92.67-61.93a15.39 15.39 0 0123.94 12.8v207.35a15.37 15.37 0 01-15.39 15.39zm-77.28-85.53l61.89 41.35V258.87l-61.89 41.36z"></path><circle class="lineal-fill" cx="289.51" cy="108.44" r="93.04"></circle><path class="lineal-stroke" d="M289.51 216.88A108.44 108.44 0 11398 108.44a108.56 108.56 0 01-108.49 108.44zm0-186.1a77.66 77.66 0 1077.66 77.66 77.75 77.75 0 00-77.66-77.66z"></path><circle class="lineal-fill" cx="113.74" cy="124.52" r="76.96"></circle><path class="lineal-stroke" d="M113.74 216.88a92.36 92.36 0 1192.36-92.36 92.46 92.46 0 01-92.36 92.36zm0-153.93a61.58 61.58 0 1061.58 61.57A61.64 61.64 0 00113.74 63zM155.59 420a15.39 15.39 0 01-7.71-28.72l94.31-54.44L171 295.76v34.16a15.39 15.39 0 11-30.78 0V269.1a15.39 15.39 0 0123.08-13.33l117.39 67.78a15.38 15.38 0 010 26.65L163.27 418a15.3 15.3 0 01-7.68 2z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 481.3" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video-camera.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M385.8 481.3H33.53A33.57 33.57 0 010 447.76v-228a33.57 33.57 0 0133.53-33.54H385.8a33.57 33.57 0 0133.53 33.54v135.55a15.39 15.39 0 01-30.78 0V219.75a2.76 2.76 0 00-2.75-2.75H33.53a2.76 2.76 0 00-2.75 2.76v228a2.76 2.76 0 002.75 2.76H385.8a15.39 15.39 0 010 30.78z"></path><path class="lineal-fill" d="M403.95 292v83.51l92.66 61.92V230.08L403.95 292z"></path><path class="lineal-stroke" d="M496.61 452.82a15.4 15.4 0 01-8.55-2.59l-92.67-61.92a15.41 15.41 0 01-6.84-12.8V292a15.38 15.38 0 016.84-12.79l92.67-61.93a15.39 15.39 0 0123.94 12.8v207.35a15.37 15.37 0 01-15.39 15.39zm-77.28-85.53l61.89 41.35V258.87l-61.89 41.36z"></path><circle class="lineal-fill" cx="289.51" cy="108.44" r="93.04"></circle><path class="lineal-stroke" d="M289.51 216.88A108.44 108.44 0 11398 108.44a108.56 108.56 0 01-108.49 108.44zm0-186.1a77.66 77.66 0 1077.66 77.66 77.75 77.75 0 00-77.66-77.66z"></path><circle class="lineal-fill" cx="113.74" cy="124.52" r="76.96"></circle><path class="lineal-stroke" d="M113.74 216.88a92.36 92.36 0 1192.36-92.36 92.46 92.46 0 01-92.36 92.36zm0-153.93a61.58 61.58 0 1061.58 61.57A61.64 61.64 0 00113.74 63zM155.59 420a15.39 15.39 0 01-7.71-28.72l94.31-54.44L171 295.76v34.16a15.39 15.39 0 11-30.78 0V269.1a15.39 15.39 0 0123.08-13.33l117.39 67.78a15.38 15.38 0 010 26.65L163.27 418a15.3 15.3 0 01-7.68 2z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">video-camera</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video-camera.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video-camera.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 332" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video-editing.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M318 0H53.9C24.2.1.1 24.2 0 53.9v210.8c0 29.8 24.2 53.9 53.9 53.9H318c29.8 0 54-24.1 54-53.9V53.9C371.9 24.1 347.8 0 318 0zm31.3 264.7c0 17.3-14 31.3-31.3 31.3H54c-17.3 0-31.3-14-31.3-31.3V53.9c0-17.3 13.9-31.3 31.2-31.3H318c17.3 0 31.3 14 31.3 31.3v210.8z"></path><path class="lineal-fill" d="M152.5 189.9v-65.7c0-3.8 3-6.8 6.8-6.8 1.2 0 2.3.3 3.3.9l57.9 32.8c3.3 1.9 4.4 6 2.6 9.3-.6 1.1-1.5 1.9-2.6 2.6l-57.9 32.8c-3.3 1.9-7.4.7-9.3-2.6-.5-1-.8-2.1-.8-3.3z"></path><path class="lineal-stroke" d="M159.3 208c-10 0-18.1-8.1-18.1-18.1v-65.7c0-10 8.1-18.1 18.1-18.1 3.1 0 6.2.8 8.9 2.3l57.9 32.9c8.7 4.9 11.8 16 6.8 24.7-1.6 2.9-4 5.2-6.8 6.8l-57.9 32.8c-2.7 1.6-5.8 2.4-8.9 2.4zm4.5-76v50.1L208 157l-44.2-25z"></path><path class="lineal-stroke" d="M186 261.2c-56.3 0-101.9-45.7-101.9-101.9.2-6.3 5.4-11.2 11.7-11 6 .2 10.8 5 11 11 0 43.8 35.5 79.3 79.3 79.3s79.3-35.5 79.3-79.3S229.8 80 186 80c-6.3-.2-11.2-5.4-11-11.7.2-6 5-10.8 11-11 56.3.6 101.5 46.6 100.9 102.9-.5 55.6-45.4 100.5-100.9 101z"></path><path class="lineal-fill" d="M201.7 314.2l-30.6 6.3c-2.2.5-4.3-1-4.8-3.2-.1-.5-.1-1.1 0-1.6l6.3-30.6c.4-1.9 1.3-3.6 2.7-5L362.2 93.2c6.2-6.2 16.3-6.2 22.5 0l8.9 8.9c6.2 6.2 6.2 16.3 0 22.5L206.7 311.5c-1.3 1.4-3.1 2.3-5 2.7z"></path><path class="lineal-stroke" d="M401.6 94.1l-8.9-8.9c-10.6-10.6-27.9-10.6-38.5 0l-20.5 20.5c-.8.5-1.6 1.1-2.3 1.9-.5.6-1 1.2-1.4 1.8L167.3 272.2c-3 2.9-5 6.6-5.8 10.7l-6.3 30.6c-.2 1-.3 2.1-.3 3.1 0 8.5 6.9 15.4 15.4 15.4 1 0 2.1-.1 3.1-.4l30.6-6.3c4-.9 7.8-2.9 10.7-5.8l163.8-163.8c.3-.2.5-.4.8-.7s.6-.6.8-.9l21.5-21.5c10.6-10.6 10.6-27.9 0-38.5zM199.1 303.3l-19.4 4 4-19.4L340 131.7l15.4 15.4-156.3 156.2zm186.6-186.6L371.3 131 356 115.7l14.4-14.4c.8-.8 2-1.3 3.2-1.3s2.3.4 3.2 1.3l8.9 8.9c1.8 1.8 1.8 4.7 0 6.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 332" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/video-editing.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M318 0H53.9C24.2.1.1 24.2 0 53.9v210.8c0 29.8 24.2 53.9 53.9 53.9H318c29.8 0 54-24.1 54-53.9V53.9C371.9 24.1 347.8 0 318 0zm31.3 264.7c0 17.3-14 31.3-31.3 31.3H54c-17.3 0-31.3-14-31.3-31.3V53.9c0-17.3 13.9-31.3 31.2-31.3H318c17.3 0 31.3 14 31.3 31.3v210.8z"></path><path class="lineal-fill" d="M152.5 189.9v-65.7c0-3.8 3-6.8 6.8-6.8 1.2 0 2.3.3 3.3.9l57.9 32.8c3.3 1.9 4.4 6 2.6 9.3-.6 1.1-1.5 1.9-2.6 2.6l-57.9 32.8c-3.3 1.9-7.4.7-9.3-2.6-.5-1-.8-2.1-.8-3.3z"></path><path class="lineal-stroke" d="M159.3 208c-10 0-18.1-8.1-18.1-18.1v-65.7c0-10 8.1-18.1 18.1-18.1 3.1 0 6.2.8 8.9 2.3l57.9 32.9c8.7 4.9 11.8 16 6.8 24.7-1.6 2.9-4 5.2-6.8 6.8l-57.9 32.8c-2.7 1.6-5.8 2.4-8.9 2.4zm4.5-76v50.1L208 157l-44.2-25z"></path><path class="lineal-stroke" d="M186 261.2c-56.3 0-101.9-45.7-101.9-101.9.2-6.3 5.4-11.2 11.7-11 6 .2 10.8 5 11 11 0 43.8 35.5 79.3 79.3 79.3s79.3-35.5 79.3-79.3S229.8 80 186 80c-6.3-.2-11.2-5.4-11-11.7.2-6 5-10.8 11-11 56.3.6 101.5 46.6 100.9 102.9-.5 55.6-45.4 100.5-100.9 101z"></path><path class="lineal-fill" d="M201.7 314.2l-30.6 6.3c-2.2.5-4.3-1-4.8-3.2-.1-.5-.1-1.1 0-1.6l6.3-30.6c.4-1.9 1.3-3.6 2.7-5L362.2 93.2c6.2-6.2 16.3-6.2 22.5 0l8.9 8.9c6.2 6.2 6.2 16.3 0 22.5L206.7 311.5c-1.3 1.4-3.1 2.3-5 2.7z"></path><path class="lineal-stroke" d="M401.6 94.1l-8.9-8.9c-10.6-10.6-27.9-10.6-38.5 0l-20.5 20.5c-.8.5-1.6 1.1-2.3 1.9-.5.6-1 1.2-1.4 1.8L167.3 272.2c-3 2.9-5 6.6-5.8 10.7l-6.3 30.6c-.2 1-.3 2.1-.3 3.1 0 8.5 6.9 15.4 15.4 15.4 1 0 2.1-.1 3.1-.4l30.6-6.3c4-.9 7.8-2.9 10.7-5.8l163.8-163.8c.3-.2.5-.4.8-.7s.6-.6.8-.9l21.5-21.5c10.6-10.6 10.6-27.9 0-38.5zM199.1 303.3l-19.4 4 4-19.4L340 131.7l15.4 15.4-156.3 156.2zm186.6-186.6L371.3 131 356 115.7l14.4-14.4c.8-.8 2-1.3 3.2-1.3s2.3.4 3.2 1.3l8.9 8.9c1.8 1.8 1.8 4.7 0 6.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">video-editing</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video-editing.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/video-editing.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 383.36 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/wallet.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M11.5 220.22A11.5 11.5 0 010 208.72v-53.66A77.14 77.14 0 0177.06 78h239.61a11.5 11.5 0 010 23H77.06A54.12 54.12 0 0023 155.06v53.66a11.5 11.5 0 01-11.5 11.5z"></path><path class="lineal-fill" d="M260.2 138.87a82.37 82.37 0 10-138 0z"></path><path class="lineal-stroke" d="M260.2 150.37h-138a11.49 11.49 0 01-9.63-5.21 94.23 94.23 0 0112.27-117.67 93.88 93.88 0 01132.75 0 94.23 94.23 0 0112.24 117.67 11.49 11.49 0 01-9.63 5.21zm-131.44-23h124.91a71.18 71.18 0 00-12.35-83.61 70.85 70.85 0 00-100.21 0 71.18 71.18 0 00-12.35 83.61z"></path><path class="lineal-stroke" d="M189.6 128.68c-11.73-.3-20.55-6.6-20.55-12 0-2.71 2.43-6.78 5.43-6.78 3.69 0 6.59 6.3 15.12 7.27V97.85c-8.82-3.3-18.8-7.08-18.8-19.49s9.11-17.64 18.8-18.9v-2.71c0-1.26 1.46-2.43 3.3-2.43 1.65 0 3.3 1.17 3.3 2.43v2.52c6.3.19 16.57 2 16.57 7.66 0 2.22-1.55 6.68-5.14 6.68-2.71 0-4.94-3.1-11.43-3.58v17.06c8.62 3.2 18.32 7.56 18.32 20.74 0 11.93-7.47 18.81-18.32 20.55v3c0 1.26-1.65 2.42-3.3 2.42-1.84 0-3.3-1.16-3.3-2.42zm.78-43.68V70.32c-4.84.77-7.76 3.1-7.76 6.79 0 4.26 3.3 6.1 7.76 7.85zm5 15.22V117c4.27-.87 7.27-3.39 7.27-8 0-4.75-3.1-7.07-7.27-8.91z"></path><path class="lineal-stroke" d="M319.3 409.6H77.06A77.15 77.15 0 010 332.54V204.79a77.16 77.16 0 0177.06-77.06h242.25a40.36 40.36 0 0140.31 40.33v66.84a11.5 11.5 0 11-23 0v-66.84a17.34 17.34 0 00-17.31-17.32H77.06a54.12 54.12 0 00-54.06 54v127.8a54.12 54.12 0 0054.06 54.06h242.25a17.34 17.34 0 0017.31-17.32v-10.92a11.5 11.5 0 0123 0v10.92a40.36 40.36 0 01-40.32 40.32z"></path><path class="lineal-fill" d="M371.86 309.66h-91.62a43.82 43.82 0 010-87.63h91.62z"></path><path class="lineal-stroke" d="M371.86 321.16h-91.62a55.32 55.32 0 110-110.64h91.62a11.52 11.52 0 0111.5 11.48v87.63a11.51 11.51 0 01-11.5 11.5zm-91.62-87.63a32.32 32.32 0 000 64.63h80.11v-64.63z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 383.36 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/wallet.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M11.5 220.22A11.5 11.5 0 010 208.72v-53.66A77.14 77.14 0 0177.06 78h239.61a11.5 11.5 0 010 23H77.06A54.12 54.12 0 0023 155.06v53.66a11.5 11.5 0 01-11.5 11.5z"></path><path class="lineal-fill" d="M260.2 138.87a82.37 82.37 0 10-138 0z"></path><path class="lineal-stroke" d="M260.2 150.37h-138a11.49 11.49 0 01-9.63-5.21 94.23 94.23 0 0112.27-117.67 93.88 93.88 0 01132.75 0 94.23 94.23 0 0112.24 117.67 11.49 11.49 0 01-9.63 5.21zm-131.44-23h124.91a71.18 71.18 0 00-12.35-83.61 70.85 70.85 0 00-100.21 0 71.18 71.18 0 00-12.35 83.61z"></path><path class="lineal-stroke" d="M189.6 128.68c-11.73-.3-20.55-6.6-20.55-12 0-2.71 2.43-6.78 5.43-6.78 3.69 0 6.59 6.3 15.12 7.27V97.85c-8.82-3.3-18.8-7.08-18.8-19.49s9.11-17.64 18.8-18.9v-2.71c0-1.26 1.46-2.43 3.3-2.43 1.65 0 3.3 1.17 3.3 2.43v2.52c6.3.19 16.57 2 16.57 7.66 0 2.22-1.55 6.68-5.14 6.68-2.71 0-4.94-3.1-11.43-3.58v17.06c8.62 3.2 18.32 7.56 18.32 20.74 0 11.93-7.47 18.81-18.32 20.55v3c0 1.26-1.65 2.42-3.3 2.42-1.84 0-3.3-1.16-3.3-2.42zm.78-43.68V70.32c-4.84.77-7.76 3.1-7.76 6.79 0 4.26 3.3 6.1 7.76 7.85zm5 15.22V117c4.27-.87 7.27-3.39 7.27-8 0-4.75-3.1-7.07-7.27-8.91z"></path><path class="lineal-stroke" d="M319.3 409.6H77.06A77.15 77.15 0 010 332.54V204.79a77.16 77.16 0 0177.06-77.06h242.25a40.36 40.36 0 0140.31 40.33v66.84a11.5 11.5 0 11-23 0v-66.84a17.34 17.34 0 00-17.31-17.32H77.06a54.12 54.12 0 00-54.06 54v127.8a54.12 54.12 0 0054.06 54.06h242.25a17.34 17.34 0 0017.31-17.32v-10.92a11.5 11.5 0 0123 0v10.92a40.36 40.36 0 01-40.32 40.32z"></path><path class="lineal-fill" d="M371.86 309.66h-91.62a43.82 43.82 0 010-87.63h91.62z"></path><path class="lineal-stroke" d="M371.86 321.16h-91.62a55.32 55.32 0 110-110.64h91.62a11.52 11.52 0 0111.5 11.48v87.63a11.51 11.51 0 01-11.5 11.5zm-91.62-87.63a32.32 32.32 0 000 64.63h80.11v-64.63z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">wallet</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/wallet.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/wallet.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 318.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/watercolor.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M254.7 315.3c-41.1.1-80.5-16.2-109.6-45.3l-18.7-18.7c-19.2-19.3-19-50.6.3-69.7 19.2-19 50.2-19 69.4 0 1.4 1.4 3.6 1.4 5 0s1.4-3.6 0-5l-56-56c-19.2-19.3-19.2-50.4 0-69.7 61.3-59.7 159.4-58.3 219.1 3 58.5 60.2 58.5 156 0 216.1-29 29.1-68.4 45.5-109.5 45.3zm-93.4-125.6c-14.8 0-26.7 12-26.7 26.7 0 7.1 2.8 13.9 7.8 18.9l18.7 18.7c51.7 51.7 135.5 51.7 187.2 0s51.7-135.5 0-187.2-135.5-51.7-187.1 0c-10.4 10.4-10.4 27.3 0 37.8l56 56c10 10.4 9.7 26.9-.7 36.9-10.1 9.7-26.1 9.7-36.2 0-5.1-5-11.9-7.8-19-7.8z"></path><path class="lineal-fill" d="M309.9 215.2c-9.6-9.6-25.1-9.6-34.6 0-9.6 9.6-9.6 25.1 0 34.6 9.6 9.6 25.1 9.6 34.6 0 9.6-9.5 9.6-25 0-34.6z"></path><path class="lineal-stroke" d="M292.6 268.3c-19.8 0-35.8-16-35.8-35.8s16-35.8 35.8-35.8 35.8 16 35.8 35.8c0 9.5-3.8 18.6-10.5 25.3-6.7 6.8-15.8 10.5-25.3 10.5zm0-49c-7.3 0-13.2 5.9-13.2 13.2s5.9 13.2 13.2 13.2 13.2-5.9 13.2-13.2c0-3.5-1.4-6.9-3.9-9.3-2.5-2.5-5.8-3.9-9.3-3.9z"></path><path class="lineal-fill" d="M263.3 55.5c-13.1-3.5-26.5 4.3-30 17.3-3.5 13.1 4.2 26.5 17.3 30 13.1 3.5 26.5-4.2 30-17.3 3.6-13-4.2-26.5-17.3-30z"></path><path class="lineal-stroke" d="M257 115c-19.8 0-35.8-16-35.8-35.7 0-19.8 16-35.8 35.7-35.8s35.8 16 35.8 35.7c0 12.8-6.8 24.6-17.9 31-5.4 3.1-11.5 4.8-17.8 4.8zm-.1-49c-2.3 0-4.6.6-6.6 1.8-3 1.7-5.3 4.6-6.1 8-1.9 7 2.3 14.3 9.3 16.2 7.1 1.8 14.3-2.5 16.1-9.5s-2.3-14-9.2-16c-1.1-.4-2.3-.5-3.5-.5z"></path><path class="lineal-fill" d="M345.6 121.5c-9.6-9.6-25.1-9.6-34.6 0s-9.6 25.1 0 34.6c9.6 9.6 25.1 9.6 34.6 0 6.2-6.2 8.6-15.2 6.4-23.6-1.2-4.1-3.4-7.9-6.4-11z"></path><path class="lineal-stroke" d="M328.3 174.6c-16.2 0-30.4-10.9-34.6-26.5-5.1-19.1 6.3-38.7 25.4-43.8 3-.8 6.1-1.2 9.2-1.2 19.8 0 35.8 16 35.8 35.7 0 16.2-10.9 30.4-26.6 34.6-3 .8-6.1 1.3-9.2 1.2zm-.1-49c-1.1 0-2.3.1-3.4.4-7 1.9-11.2 9.1-9.3 16.2 1.5 5.8 6.8 9.8 12.8 9.8 1.1 0 2.3-.2 3.4-.4 7-1.9 11.2-9.1 9.3-16.2-.6-2.2-1.8-4.3-3.4-5.9-2.5-2.5-5.9-3.9-9.4-3.9z"></path><path class="lineal-fill" d="M98.5 75.7c0-34.4-43.6-62.3-43.6-62.3S11.3 41.3 11.3 75.7c0 19.4 6.2 36.7 15.9 48.1 5.4 6.4 11.9 10.9 19 13 2.9.8 5.8 1.3 8.8 1.3.5 0 1.1 0 1.6-.1 23.3-1.2 42-28.6 41.9-62.3z"></path><path class="lineal-stroke" d="M109.8 75.7C109.8 35.6 63 5.2 61 3.9L54.9 0l-6.1 3.9C46.8 5.2 0 35.6 0 75.7c0 21.3 6.8 41.5 18.5 55.4 1.8 2.1 3.7 4 5.6 5.8h-3.7v22.6h4.3V290c0 15.8 12.9 28.7 28.7 28.7h3.1c15.8 0 28.7-12.8 28.8-28.7V159.5h4.2v-22.6h-4c14.7-13.2 24.3-35.7 24.3-61.2zM54.9 27.2C67.5 37 87.2 56.3 87.2 75.7c0 27.2-14 50.1-31.3 51-2.2.1-4.5-.2-6.6-.8-4.8-1.4-9.5-4.6-13.5-9.4-8.4-9.9-13.2-24.8-13.2-40.8 0-19.5 19.7-38.8 32.3-48.5zM62.6 290c-.1 3.3-2.8 6.1-6.2 6.1h-3.1c-3.3 0-6.1-2.7-6.1-6.1V160.6h15.4V290z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 318.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/watercolor.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M254.7 315.3c-41.1.1-80.5-16.2-109.6-45.3l-18.7-18.7c-19.2-19.3-19-50.6.3-69.7 19.2-19 50.2-19 69.4 0 1.4 1.4 3.6 1.4 5 0s1.4-3.6 0-5l-56-56c-19.2-19.3-19.2-50.4 0-69.7 61.3-59.7 159.4-58.3 219.1 3 58.5 60.2 58.5 156 0 216.1-29 29.1-68.4 45.5-109.5 45.3zm-93.4-125.6c-14.8 0-26.7 12-26.7 26.7 0 7.1 2.8 13.9 7.8 18.9l18.7 18.7c51.7 51.7 135.5 51.7 187.2 0s51.7-135.5 0-187.2-135.5-51.7-187.1 0c-10.4 10.4-10.4 27.3 0 37.8l56 56c10 10.4 9.7 26.9-.7 36.9-10.1 9.7-26.1 9.7-36.2 0-5.1-5-11.9-7.8-19-7.8z"></path><path class="lineal-fill" d="M309.9 215.2c-9.6-9.6-25.1-9.6-34.6 0-9.6 9.6-9.6 25.1 0 34.6 9.6 9.6 25.1 9.6 34.6 0 9.6-9.5 9.6-25 0-34.6z"></path><path class="lineal-stroke" d="M292.6 268.3c-19.8 0-35.8-16-35.8-35.8s16-35.8 35.8-35.8 35.8 16 35.8 35.8c0 9.5-3.8 18.6-10.5 25.3-6.7 6.8-15.8 10.5-25.3 10.5zm0-49c-7.3 0-13.2 5.9-13.2 13.2s5.9 13.2 13.2 13.2 13.2-5.9 13.2-13.2c0-3.5-1.4-6.9-3.9-9.3-2.5-2.5-5.8-3.9-9.3-3.9z"></path><path class="lineal-fill" d="M263.3 55.5c-13.1-3.5-26.5 4.3-30 17.3-3.5 13.1 4.2 26.5 17.3 30 13.1 3.5 26.5-4.2 30-17.3 3.6-13-4.2-26.5-17.3-30z"></path><path class="lineal-stroke" d="M257 115c-19.8 0-35.8-16-35.8-35.7 0-19.8 16-35.8 35.7-35.8s35.8 16 35.8 35.7c0 12.8-6.8 24.6-17.9 31-5.4 3.1-11.5 4.8-17.8 4.8zm-.1-49c-2.3 0-4.6.6-6.6 1.8-3 1.7-5.3 4.6-6.1 8-1.9 7 2.3 14.3 9.3 16.2 7.1 1.8 14.3-2.5 16.1-9.5s-2.3-14-9.2-16c-1.1-.4-2.3-.5-3.5-.5z"></path><path class="lineal-fill" d="M345.6 121.5c-9.6-9.6-25.1-9.6-34.6 0s-9.6 25.1 0 34.6c9.6 9.6 25.1 9.6 34.6 0 6.2-6.2 8.6-15.2 6.4-23.6-1.2-4.1-3.4-7.9-6.4-11z"></path><path class="lineal-stroke" d="M328.3 174.6c-16.2 0-30.4-10.9-34.6-26.5-5.1-19.1 6.3-38.7 25.4-43.8 3-.8 6.1-1.2 9.2-1.2 19.8 0 35.8 16 35.8 35.7 0 16.2-10.9 30.4-26.6 34.6-3 .8-6.1 1.3-9.2 1.2zm-.1-49c-1.1 0-2.3.1-3.4.4-7 1.9-11.2 9.1-9.3 16.2 1.5 5.8 6.8 9.8 12.8 9.8 1.1 0 2.3-.2 3.4-.4 7-1.9 11.2-9.1 9.3-16.2-.6-2.2-1.8-4.3-3.4-5.9-2.5-2.5-5.9-3.9-9.4-3.9z"></path><path class="lineal-fill" d="M98.5 75.7c0-34.4-43.6-62.3-43.6-62.3S11.3 41.3 11.3 75.7c0 19.4 6.2 36.7 15.9 48.1 5.4 6.4 11.9 10.9 19 13 2.9.8 5.8 1.3 8.8 1.3.5 0 1.1 0 1.6-.1 23.3-1.2 42-28.6 41.9-62.3z"></path><path class="lineal-stroke" d="M109.8 75.7C109.8 35.6 63 5.2 61 3.9L54.9 0l-6.1 3.9C46.8 5.2 0 35.6 0 75.7c0 21.3 6.8 41.5 18.5 55.4 1.8 2.1 3.7 4 5.6 5.8h-3.7v22.6h4.3V290c0 15.8 12.9 28.7 28.7 28.7h3.1c15.8 0 28.7-12.8 28.8-28.7V159.5h4.2v-22.6h-4c14.7-13.2 24.3-35.7 24.3-61.2zM54.9 27.2C67.5 37 87.2 56.3 87.2 75.7c0 27.2-14 50.1-31.3 51-2.2.1-4.5-.2-6.6-.8-4.8-1.4-9.5-4.6-13.5-9.4-8.4-9.9-13.2-24.8-13.2-40.8 0-19.5 19.7-38.8 32.3-48.5zM62.6 290c-.1 3.3-2.8 6.1-6.2 6.1h-3.1c-3.3 0-6.1-2.7-6.1-6.1V160.6h15.4V290z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">watercolor</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/watercolor.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/watercolor.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 325.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/web.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M371.7 249v-59.6c0-27.8-22.6-50.4-50.4-50.4H215.5V97.2h10c15.4 0 27.9-12.5 27.9-27.9V27.9c0-15.4-12.5-27.9-27.9-27.9h-41.3c-15.4 0-27.9 12.5-27.9 27.9v41.3c0 15.4 12.5 27.9 27.9 27.9h10V139H88.3c-27.8 0-50.3 22.6-50.4 50.4V258h21.4v-68.6c0-16 13-29 29-29h105.8v88.7h21.4v-88.7h105.8c16 0 29 13 29 29V249h21.4zM177.6 69.3V27.9c0-3.6 2.9-6.5 6.5-6.5h41.3c3.6 0 6.5 2.9 6.5 6.5v41.3c0 3.6-2.9 6.5-6.5 6.5h-41.3c-3.6.1-6.5-2.8-6.5-6.4z"></path><path class="lineal-fill" d="M69.3 314.8H27.9c-9.5 0-17.2-7.7-17.2-17.2v-41.4c0-9.5 7.7-17.2 17.2-17.2h41.3c9.5 0 17.2 7.7 17.2 17.2v41.4c.1 9.5-7.6 17.2-17.1 17.2z"></path><path class="lineal-stroke" d="M69.3 325.5H27.9C12.5 325.5 0 313 0 297.6v-41.4c0-15.4 12.5-27.9 27.9-27.9h41.3c15.4 0 27.9 12.5 27.9 27.9v41.4c.1 15.4-12.4 27.9-27.8 27.9zm-41.4-75.8c-3.6 0-6.5 2.9-6.5 6.5v41.4c0 3.6 2.9 6.5 6.5 6.5h41.3c3.6 0 6.5-2.9 6.5-6.5v-41.4c0-3.6-2.9-6.5-6.5-6.5H27.9z"></path><path class="lineal-fill" d="M225.5 314.8h-41.3c-9.5 0-17.2-7.7-17.2-17.2v-41.4c0-9.5 7.7-17.2 17.2-17.2h41.3c9.5 0 17.2 7.7 17.2 17.2v41.4c0 9.5-7.7 17.2-17.2 17.2z"></path><path class="lineal-stroke" d="M225.5 325.5h-41.3c-15.4 0-27.9-12.5-27.9-27.9v-41.4c0-15.4 12.5-27.9 27.9-27.9h41.3c15.4 0 27.9 12.5 27.9 27.9v41.4c0 15.4-12.5 27.9-27.9 27.9zm-41.4-75.8c-3.6 0-6.5 2.9-6.5 6.5v41.4c0 3.6 2.9 6.5 6.5 6.5h41.3c3.6 0 6.5-2.9 6.5-6.5v-41.4c0-3.6-2.9-6.5-6.5-6.5h-41.3z"></path><path class="lineal-fill" d="M381.7 314.8h-41.3c-9.5 0-17.2-7.7-17.2-17.2v-41.4c0-9.5 7.7-17.2 17.2-17.2h41.3c9.5 0 17.2 7.7 17.2 17.2v41.4c0 9.5-7.7 17.2-17.2 17.2z"></path><path class="lineal-stroke" d="M381.7 325.5h-41.3c-15.4 0-27.9-12.5-27.9-27.9v-41.4c0-15.4 12.5-27.9 27.9-27.9h41.3c15.4 0 27.9 12.5 27.9 27.9v41.4c0 15.4-12.5 27.9-27.9 27.9zm-41.4-75.8c-3.6 0-6.5 2.9-6.5 6.5v41.4c0 3.6 2.9 6.5 6.5 6.5h41.3c3.6 0 6.5-2.9 6.5-6.5v-41.4c0-3.6-2.9-6.5-6.5-6.5h-41.3z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 325.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/web.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M371.7 249v-59.6c0-27.8-22.6-50.4-50.4-50.4H215.5V97.2h10c15.4 0 27.9-12.5 27.9-27.9V27.9c0-15.4-12.5-27.9-27.9-27.9h-41.3c-15.4 0-27.9 12.5-27.9 27.9v41.3c0 15.4 12.5 27.9 27.9 27.9h10V139H88.3c-27.8 0-50.3 22.6-50.4 50.4V258h21.4v-68.6c0-16 13-29 29-29h105.8v88.7h21.4v-88.7h105.8c16 0 29 13 29 29V249h21.4zM177.6 69.3V27.9c0-3.6 2.9-6.5 6.5-6.5h41.3c3.6 0 6.5 2.9 6.5 6.5v41.3c0 3.6-2.9 6.5-6.5 6.5h-41.3c-3.6.1-6.5-2.8-6.5-6.4z"></path><path class="lineal-fill" d="M69.3 314.8H27.9c-9.5 0-17.2-7.7-17.2-17.2v-41.4c0-9.5 7.7-17.2 17.2-17.2h41.3c9.5 0 17.2 7.7 17.2 17.2v41.4c.1 9.5-7.6 17.2-17.1 17.2z"></path><path class="lineal-stroke" d="M69.3 325.5H27.9C12.5 325.5 0 313 0 297.6v-41.4c0-15.4 12.5-27.9 27.9-27.9h41.3c15.4 0 27.9 12.5 27.9 27.9v41.4c.1 15.4-12.4 27.9-27.8 27.9zm-41.4-75.8c-3.6 0-6.5 2.9-6.5 6.5v41.4c0 3.6 2.9 6.5 6.5 6.5h41.3c3.6 0 6.5-2.9 6.5-6.5v-41.4c0-3.6-2.9-6.5-6.5-6.5H27.9z"></path><path class="lineal-fill" d="M225.5 314.8h-41.3c-9.5 0-17.2-7.7-17.2-17.2v-41.4c0-9.5 7.7-17.2 17.2-17.2h41.3c9.5 0 17.2 7.7 17.2 17.2v41.4c0 9.5-7.7 17.2-17.2 17.2z"></path><path class="lineal-stroke" d="M225.5 325.5h-41.3c-15.4 0-27.9-12.5-27.9-27.9v-41.4c0-15.4 12.5-27.9 27.9-27.9h41.3c15.4 0 27.9 12.5 27.9 27.9v41.4c0 15.4-12.5 27.9-27.9 27.9zm-41.4-75.8c-3.6 0-6.5 2.9-6.5 6.5v41.4c0 3.6 2.9 6.5 6.5 6.5h41.3c3.6 0 6.5-2.9 6.5-6.5v-41.4c0-3.6-2.9-6.5-6.5-6.5h-41.3z"></path><path class="lineal-fill" d="M381.7 314.8h-41.3c-9.5 0-17.2-7.7-17.2-17.2v-41.4c0-9.5 7.7-17.2 17.2-17.2h41.3c9.5 0 17.2 7.7 17.2 17.2v41.4c0 9.5-7.7 17.2-17.2 17.2z"></path><path class="lineal-stroke" d="M381.7 325.5h-41.3c-15.4 0-27.9-12.5-27.9-27.9v-41.4c0-15.4 12.5-27.9 27.9-27.9h41.3c15.4 0 27.9 12.5 27.9 27.9v41.4c0 15.4-12.5 27.9-27.9 27.9zm-41.4-75.8c-3.6 0-6.5 2.9-6.5 6.5v41.4c0 3.6 2.9 6.5 6.5 6.5h41.3c3.6 0 6.5-2.9 6.5-6.5v-41.4c0-3.6-2.9-6.5-6.5-6.5h-41.3z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">web</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/web.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/web.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 508.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/workflow.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#3f78e0] "><path class="lineal-stroke" d="M426.83 31.41h-165.1a15.71 15.71 0 010-31.41h165.1a15.71 15.71 0 010 31.41z"></path><circle class="lineal-fill" cx="451.97" cy="448.3" r="44.33"></circle><path class="lineal-stroke" d="M452 508.34a60 60 0 1160-60 60.1 60.1 0 01-60 60zm0-88.65a28.63 28.63 0 1028.62 28.62A28.66 28.66 0 00452 419.69z"></path><circle class="lineal-fill" cx="60.03" cy="448.3" r="44.33"></circle><path class="lineal-fill" d="M207.85 409.17h96.31v81.39h-96.31z"></path><path class="lineal-stroke" d="M452 331.86H271.7v-53h155.13a15.7 15.7 0 0015.7-15.71V74.61a15.7 15.7 0 00-15.7-15.71H191.22a15.71 15.71 0 100 31.41h219.91v157.12H100.87v-216h90.35a15.71 15.71 0 000-31.41h-106a15.7 15.7 0 00-15.7 15.7v247.41a15.7 15.7 0 0015.7 15.71H240.3v53H60a15.7 15.7 0 00-15.7 15.7v42.82a60 60 0 1031.4 0v-27.09h164.6v30.19h-32.46a15.7 15.7 0 00-15.7 15.7v81.4a15.7 15.7 0 0015.7 15.7h96.31a15.7 15.7 0 0015.71-15.7v-81.4a15.7 15.7 0 00-15.71-15.7H271.7v-30.19H452a15.71 15.71 0 000-31.41zM88.66 448.31A28.63 28.63 0 1160 419.68a28.66 28.66 0 0128.66 28.63zm199.79 26.54h-64.9v-50h64.9v50z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 508.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/workflow.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   text-[#e31e24] "><path class="lineal-stroke" d="M426.83 31.41h-165.1a15.71 15.71 0 010-31.41h165.1a15.71 15.71 0 010 31.41z"></path><circle class="lineal-fill" cx="451.97" cy="448.3" r="44.33"></circle><path class="lineal-stroke" d="M452 508.34a60 60 0 1160-60 60.1 60.1 0 01-60 60zm0-88.65a28.63 28.63 0 1028.62 28.62A28.66 28.66 0 00452 419.69z"></path><circle class="lineal-fill" cx="60.03" cy="448.3" r="44.33"></circle><path class="lineal-fill" d="M207.85 409.17h96.31v81.39h-96.31z"></path><path class="lineal-stroke" d="M452 331.86H271.7v-53h155.13a15.7 15.7 0 0015.7-15.71V74.61a15.7 15.7 0 00-15.7-15.71H191.22a15.71 15.71 0 100 31.41h219.91v157.12H100.87v-216h90.35a15.71 15.71 0 000-31.41h-106a15.7 15.7 0 00-15.7 15.7v247.41a15.7 15.7 0 0015.7 15.71H240.3v53H60a15.7 15.7 0 00-15.7 15.7v42.82a60 60 0 1031.4 0v-27.09h164.6v30.19h-32.46a15.7 15.7 0 00-15.7 15.7v81.4a15.7 15.7 0 0015.7 15.7h96.31a15.7 15.7 0 0015.71-15.7v-81.4a15.7 15.7 0 00-15.71-15.7H271.7v-30.19H452a15.71 15.71 0 000-31.41zM88.66 448.31A28.63 28.63 0 1160 419.68a28.66 28.66 0 0128.66 28.63zm199.79 26.54h-64.9v-50h64.9v50z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">workflow</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/workflow.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/lineal/workflow.html class=&quot;svg-inject icon-svg icon-svg-sm text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
               </ul>
@@ -2374,8 +2374,8 @@
                   <div class="flex flex-wrap mx-[-15px] !mt-[-40px] !text-center">
                     <div class="w-6/12 md:w-4/12 lg:w-3/12 xl:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-primary !text-[#3f78e0]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-primary !text-[#3f78e0]  mx-2"><path class="fill-primary" d="M250.75 0c-50-.89-107 25.22-143 65.75a135.36 135.36 0 00-92.77 39.5 5.32 5.32 0 003 9.07L59 120.23l-5 5.68a5.34 5.34 0 00.2 7.33l68.56 68.56a5.32 5.32 0 007.33.21l5.68-5.08 5.86 41.07a5.31 5.31 0 003.78 4.11 4.88 4.88 0 001.52.24 6.06 6.06 0 004.12-1.71 135 135 0 0039.16-92.42c40.57-36.14 66.89-93.12 65.74-143a5.33 5.33 0 00-5.2-5.2zM201.6 92.1a26.66 26.66 0 110-37.71 26.57 26.57 0 010 37.71z"></path><path class="fill-secondary" d="M29.05 180.31C17.63 191.72 2 243.3.22 249.14A5.36 5.36 0 005.33 256a5.41 5.41 0 001.53-.23c5.84-1.74 57.41-17.42 68.83-28.85a33 33 0 00-46.64-46.62z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-primary !text-[#e31e24]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-primary !text-[#e31e24]  mx-2"><path class="fill-primary" d="M250.75 0c-50-.89-107 25.22-143 65.75a135.36 135.36 0 00-92.77 39.5 5.32 5.32 0 003 9.07L59 120.23l-5 5.68a5.34 5.34 0 00.2 7.33l68.56 68.56a5.32 5.32 0 007.33.21l5.68-5.08 5.86 41.07a5.31 5.31 0 003.78 4.11 4.88 4.88 0 001.52.24 6.06 6.06 0 004.12-1.71 135 135 0 0039.16-92.42c40.57-36.14 66.89-93.12 65.74-143a5.33 5.33 0 00-5.2-5.2zM201.6 92.1a26.66 26.66 0 110-37.71 26.57 26.57 0 010 37.71z"></path><path class="fill-secondary" d="M29.05 180.31C17.63 191.72 2 243.3.22 249.14A5.36 5.36 0 005.33 256a5.41 5.41 0 001.53-.23c5.84-1.74 57.41-17.42 68.83-28.85a33 33 0 00-46.64-46.62z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">text-primary </code>
                     </div>
@@ -2462,8 +2462,8 @@
                     <!-- /column -->
                     <div class="w-6/12 md:w-4/12 lg:w-3/12 xl:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-blue !text-[#3f78e0] mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-blue !text-[#3f78e0] mx-2"><path class="fill-primary" d="M250.75 0c-50-.89-107 25.22-143 65.75a135.36 135.36 0 00-92.77 39.5 5.32 5.32 0 003 9.07L59 120.23l-5 5.68a5.34 5.34 0 00.2 7.33l68.56 68.56a5.32 5.32 0 007.33.21l5.68-5.08 5.86 41.07a5.31 5.31 0 003.78 4.11 4.88 4.88 0 001.52.24 6.06 6.06 0 004.12-1.71 135 135 0 0039.16-92.42c40.57-36.14 66.89-93.12 65.74-143a5.33 5.33 0 00-5.2-5.2zM201.6 92.1a26.66 26.66 0 110-37.71 26.57 26.57 0 010 37.71z"></path><path class="fill-secondary" d="M29.05 180.31C17.63 191.72 2 243.3.22 249.14A5.36 5.36 0 005.33 256a5.41 5.41 0 001.53-.23c5.84-1.74 57.41-17.42 68.83-28.85a33 33 0 00-46.64-46.62z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-blue !text-[#e31e24] mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-blue !text-[#e31e24] mx-2"><path class="fill-primary" d="M250.75 0c-50-.89-107 25.22-143 65.75a135.36 135.36 0 00-92.77 39.5 5.32 5.32 0 003 9.07L59 120.23l-5 5.68a5.34 5.34 0 00.2 7.33l68.56 68.56a5.32 5.32 0 007.33.21l5.68-5.08 5.86 41.07a5.31 5.31 0 003.78 4.11 4.88 4.88 0 001.52.24 6.06 6.06 0 004.12-1.71 135 135 0 0039.16-92.42c40.57-36.14 66.89-93.12 65.74-143a5.33 5.33 0 00-5.2-5.2zM201.6 92.1a26.66 26.66 0 110-37.71 26.57 26.57 0 010 37.71z"></path><path class="fill-secondary" d="M29.05 180.31C17.63 191.72 2 243.3.22 249.14A5.36 5.36 0 005.33 256a5.41 5.41 0 001.53-.23c5.84-1.74 57.41-17.42 68.83-28.85a33 33 0 00-46.64-46.62z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">text-blue</code>
                     </div>
@@ -2506,28 +2506,28 @@
                   <div class="flex-wrap mx-[-15px] !mt-[-40px] !text-center flex items-end">
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg icon-svg-lg inline-block solid-mono text-primary !text-[#3f78e0]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg icon-svg-lg inline-block solid-mono text-primary !text-[#e31e24]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-lg</code>
                     </div>
                     <!-- /column -->
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] inline-block solid-mono text-primary !text-[#3f78e0]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] inline-block solid-mono text-primary !text-[#e31e24]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-md</code>
                     </div>
                     <!-- /column -->
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   solid-mono text-primary !text-[#3f78e0]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem] inline-block   solid-mono text-primary !text-[#e31e24]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-sm</code>
                     </div>
                     <!-- /column -->
                     <div class="w-6/12 xl:w-3/12 lg:w-3/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[40px]">
                       <div>
-                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-primary !text-[#3f78e0]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono text-primary !text-[#e31e24]  mx-2"><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
                       </div>
                       <code class="code whitespace-nowrap !mt-4">icon-svg-xs</code>
                     </div>
@@ -2545,1126 +2545,1126 @@
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 220.16" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/3d.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M128 0l58.67 26.66L128 53.33 72 26.66zm-10.67 66l-48-22.85v47.52a5.34 5.34 0 003.36 5l44.64 17.86zm21.34.05v47.42l44.64-17.85a5.34 5.34 0 003.36-5v-46.4z"></path><path class="fill-primary" d="M197.33 106.66L256 133.33 197.33 160l-56-26.67zm-10.66 65.98l-48-22.85v47.55a5.34 5.34 0 003.36 5l44.64 17.86zm21.33.08v47.42l44.64-17.85a5.34 5.34 0 003.36-5V150.9zM58.67 106.66l58.66 26.67L58.67 160l-56-26.67zM48 172.64L0 149.79v47.55a5.34 5.34 0 003.36 5L48 220.14zm21.33.08v47.42L114 202.29a5.34 5.34 0 003.36-5V150.9z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 220.16" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/3d.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M128 0l58.67 26.66L128 53.33 72 26.66zm-10.67 66l-48-22.85v47.52a5.34 5.34 0 003.36 5l44.64 17.86zm21.34.05v47.42l44.64-17.85a5.34 5.34 0 003.36-5v-46.4z"></path><path class="fill-primary" d="M197.33 106.66L256 133.33 197.33 160l-56-26.67zm-10.66 65.98l-48-22.85v47.55a5.34 5.34 0 003.36 5l44.64 17.86zm21.33.08v47.42l44.64-17.85a5.34 5.34 0 003.36-5V150.9zM58.67 106.66l58.66 26.67L58.67 160l-56-26.67zM48 172.64L0 149.79v47.55a5.34 5.34 0 003.36 5L48 220.14zm21.33.08v47.42L114 202.29a5.34 5.34 0 003.36-5V150.9z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">3d</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/3d.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/3d.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/alarm.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M26.64 256a10.66 10.66 0 01-8.26-17.4l23.33-28.67a10.67 10.67 0 1116.55 13.47l-23.33 28.67a10.65 10.65 0 01-8.29 3.93zm202.69 0a10.65 10.65 0 01-8.29-3.93l-23.33-28.67a10.67 10.67 0 0116.55-13.47l23.32 28.67a10.66 10.66 0 01-8.25 17.4zM10.66 72a10.66 10.66 0 01-7.54-18.2L53.79 3.13a10.67 10.67 0 0115.09 15.08L18.21 68.88A10.68 10.68 0 0110.66 72zm234.65 0a10.55 10.55 0 01-7.53-3.12L187.1 18.21a10.67 10.67 0 1115.09-15.08l50.67 50.67a10.66 10.66 0 01-7.55 18.2z"></path><path class="fill-primary" d="M128 32a112 112 0 10112 112A112.12 112.12 0 00128 32zm66.68 122.68H128A10.68 10.68 0 01117.31 144V80a10.68 10.68 0 0121.35 0v53.33h56a10.68 10.68 0 010 21.35z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/alarm.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M26.64 256a10.66 10.66 0 01-8.26-17.4l23.33-28.67a10.67 10.67 0 1116.55 13.47l-23.33 28.67a10.65 10.65 0 01-8.29 3.93zm202.69 0a10.65 10.65 0 01-8.29-3.93l-23.33-28.67a10.67 10.67 0 0116.55-13.47l23.32 28.67a10.66 10.66 0 01-8.25 17.4zM10.66 72a10.66 10.66 0 01-7.54-18.2L53.79 3.13a10.67 10.67 0 0115.09 15.08L18.21 68.88A10.68 10.68 0 0110.66 72zm234.65 0a10.55 10.55 0 01-7.53-3.12L187.1 18.21a10.67 10.67 0 1115.09-15.08l50.67 50.67a10.66 10.66 0 01-7.55 18.2z"></path><path class="fill-primary" d="M128 32a112 112 0 10112 112A112.12 112.12 0 00128 32zm66.68 122.68H128A10.68 10.68 0 01117.31 144V80a10.68 10.68 0 0121.35 0v53.33h56a10.68 10.68 0 010 21.35z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">alarm</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/alarm.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/alarm.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/audience.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M74.67 85.33A21.33 21.33 0 1196 64a21.36 21.36 0 01-21.33 21.33zM109.33 128H40a8 8 0 01-8-8 24 24 0 0124-24h37.33a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-primary" cx="224" cy="197.33" r="16"></circle><path class="fill-primary" d="M248 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-primary" cx="138.67" cy="197.33" r="16"></circle><path class="fill-primary" d="M162.67 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-secondary" d="M237.33 0h-90.67A18.68 18.68 0 00128 18.67v48a18.69 18.69 0 0018.67 18.67H160v24a8 8 0 0013.66 5.66l29.67-29.67h34A18.69 18.69 0 00256 66.67v-48A18.71 18.71 0 00237.33 0zM160 53.33a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01160 53.33zm32 0a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01192 53.33zm32 0a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01224 53.33z"></path><path class="fill-primary" d="M138.67 138.67h-128a10.67 10.67 0 100 21.33h12L32 248.85a8.07 8.07 0 008 7.15h46.58a28.7 28.7 0 01-1.25-8 45.18 45.18 0 0118.8-36.59 37 37 0 0122.32-49.2l.24-2.21h12a10.67 10.67 0 000-21.33z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/audience.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M74.67 85.33A21.33 21.33 0 1196 64a21.36 21.36 0 01-21.33 21.33zM109.33 128H40a8 8 0 01-8-8 24 24 0 0124-24h37.33a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-primary" cx="224" cy="197.33" r="16"></circle><path class="fill-primary" d="M248 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-primary" cx="138.67" cy="197.33" r="16"></circle><path class="fill-primary" d="M162.67 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-secondary" d="M237.33 0h-90.67A18.68 18.68 0 00128 18.67v48a18.69 18.69 0 0018.67 18.67H160v24a8 8 0 0013.66 5.66l29.67-29.67h34A18.69 18.69 0 00256 66.67v-48A18.71 18.71 0 00237.33 0zM160 53.33a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01160 53.33zm32 0a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01192 53.33zm32 0a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01224 53.33z"></path><path class="fill-primary" d="M138.67 138.67h-128a10.67 10.67 0 100 21.33h12L32 248.85a8.07 8.07 0 008 7.15h46.58a28.7 28.7 0 01-1.25-8 45.18 45.18 0 0118.8-36.59 37 37 0 0122.32-49.2l.24-2.21h12a10.67 10.67 0 000-21.33z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">audience</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/audience.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/audience.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/badge.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M88.75 256A32.88 32.88 0 0176 253.45a33.33 33.33 0 01-18.42-19l-7.92-21.12a12 12 0 00-7-7l-21.08-7.93A33.27 33.27 0 013 153.48l9.33-20.54a11.82 11.82 0 000-9.87L3 102.52a33.27 33.27 0 0118.56-44.91l21.12-7.92a12 12 0 007-7l7.92-21.12A33.25 33.25 0 01102.49 3L123 12.3a11.82 11.82 0 009.87 0l20.6-9.3a33.27 33.27 0 0144.91 18.59l7.92 21.12a12 12 0 007 7l21.12 7.92A33.25 33.25 0 01253 102.49L243.69 123a11.84 11.84 0 000 9.88l9.31 20.57a33.26 33.26 0 01-18.59 44.91l-21.12 7.92a12 12 0 00-7 7l-7.92 21.12A33.26 33.26 0 01153.5 253l-20.5-9.33a11.82 11.82 0 00-9.87 0L102.54 253a33.38 33.38 0 01-13.79 3zm0-234.66a12 12 0 00-11.19 7.76l-7.92 21.09a33.28 33.28 0 01-19.45 19.47l-21.12 7.92a11.92 11.92 0 00-6.67 16.11l9.32 20.55a33.15 33.15 0 010 27.53L22.4 162.3a11.92 11.92 0 006.67 16.11l21.1 7.92a33.3 33.3 0 0119.47 19.46l7.92 21.12a11.95 11.95 0 0016.12 6.67l20.54-9.33a33.25 33.25 0 0127.54 0l20.52 9.33a11.95 11.95 0 0016.12-6.67l7.92-21.11a33.28 33.28 0 0119.45-19.47l21.12-7.92a11.94 11.94 0 006.67-16.11l-9.33-20.54a33.25 33.25 0 010-27.54l9.33-20.53a11.94 11.94 0 00-6.67-16.11l-21.1-7.92a33.29 33.29 0 01-19.48-19.46l-7.92-21.12a11.93 11.93 0 00-16.11-6.67l-20.54 9.33a33.29 33.29 0 01-27.54 0l-20.53-9.33a11.82 11.82 0 00-4.92-1.09z"></path><path class="fill-secondary" d="M96 117.32A21.33 21.33 0 11117.31 96 21.35 21.35 0 0196 117.32zm64 64A21.33 21.33 0 11181.31 160 21.35 21.35 0 01160 181.32zm-64 0a10.65 10.65 0 01-8.51-17l64-85.33a10.66 10.66 0 0117.06 12.8l-64 85.33a10.69 10.69 0 01-8.55 4.2z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/badge.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M88.75 256A32.88 32.88 0 0176 253.45a33.33 33.33 0 01-18.42-19l-7.92-21.12a12 12 0 00-7-7l-21.08-7.93A33.27 33.27 0 013 153.48l9.33-20.54a11.82 11.82 0 000-9.87L3 102.52a33.27 33.27 0 0118.56-44.91l21.12-7.92a12 12 0 007-7l7.92-21.12A33.25 33.25 0 01102.49 3L123 12.3a11.82 11.82 0 009.87 0l20.6-9.3a33.27 33.27 0 0144.91 18.59l7.92 21.12a12 12 0 007 7l21.12 7.92A33.25 33.25 0 01253 102.49L243.69 123a11.84 11.84 0 000 9.88l9.31 20.57a33.26 33.26 0 01-18.59 44.91l-21.12 7.92a12 12 0 00-7 7l-7.92 21.12A33.26 33.26 0 01153.5 253l-20.5-9.33a11.82 11.82 0 00-9.87 0L102.54 253a33.38 33.38 0 01-13.79 3zm0-234.66a12 12 0 00-11.19 7.76l-7.92 21.09a33.28 33.28 0 01-19.45 19.47l-21.12 7.92a11.92 11.92 0 00-6.67 16.11l9.32 20.55a33.15 33.15 0 010 27.53L22.4 162.3a11.92 11.92 0 006.67 16.11l21.1 7.92a33.3 33.3 0 0119.47 19.46l7.92 21.12a11.95 11.95 0 0016.12 6.67l20.54-9.33a33.25 33.25 0 0127.54 0l20.52 9.33a11.95 11.95 0 0016.12-6.67l7.92-21.11a33.28 33.28 0 0119.45-19.47l21.12-7.92a11.94 11.94 0 006.67-16.11l-9.33-20.54a33.25 33.25 0 010-27.54l9.33-20.53a11.94 11.94 0 00-6.67-16.11l-21.1-7.92a33.29 33.29 0 01-19.48-19.46l-7.92-21.12a11.93 11.93 0 00-16.11-6.67l-20.54 9.33a33.29 33.29 0 01-27.54 0l-20.53-9.33a11.82 11.82 0 00-4.92-1.09z"></path><path class="fill-secondary" d="M96 117.32A21.33 21.33 0 11117.31 96 21.35 21.35 0 0196 117.32zm64 64A21.33 21.33 0 11181.31 160 21.35 21.35 0 01160 181.32zm-64 0a10.65 10.65 0 01-8.51-17l64-85.33a10.66 10.66 0 0117.06 12.8l-64 85.33a10.69 10.69 0 01-8.55 4.2z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">badge</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/badge.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/badge.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bar-chart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M32 106.67A10.67 10.67 0 0124.91 88l48-42.67a10.62 10.62 0 018.37-2.61l83 10.07 47-44.56A10.66 10.66 0 01226 23.74l-50.67 48a10.73 10.73 0 01-8.61 2.85L83.49 64.5 39.09 104a10.61 10.61 0 01-7.09 2.7z"></path><path class="fill-secondary" d="M226.67 53.34A8 8 0 01221 51l-37.32-37.34A8 8 0 01189.33 0h37.33a8 8 0 018 8v37.33a8 8 0 01-4.95 7.39 7.66 7.66 0 01-3.04.62z"></path><path class="fill-primary" d="M74.67 184v29.33h-64V184A13.33 13.33 0 0124 170.67h37.33A13.34 13.34 0 0174.67 184zM160 120v93.33H96V120a13.33 13.33 0 0113.33-13.33h37.33A13.33 13.33 0 01160 120zm85.33 21.34v72h-64v-72A13.32 13.32 0 01194.66 128H232a13.31 13.31 0 0113.33 13.34z"></path><path class="fill-secondary" d="M248 245.34H8a8 8 0 010-16h240a8 8 0 010 16z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bar-chart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M32 106.67A10.67 10.67 0 0124.91 88l48-42.67a10.62 10.62 0 018.37-2.61l83 10.07 47-44.56A10.66 10.66 0 01226 23.74l-50.67 48a10.73 10.73 0 01-8.61 2.85L83.49 64.5 39.09 104a10.61 10.61 0 01-7.09 2.7z"></path><path class="fill-secondary" d="M226.67 53.34A8 8 0 01221 51l-37.32-37.34A8 8 0 01189.33 0h37.33a8 8 0 018 8v37.33a8 8 0 01-4.95 7.39 7.66 7.66 0 01-3.04.62z"></path><path class="fill-primary" d="M74.67 184v29.33h-64V184A13.33 13.33 0 0124 170.67h37.33A13.34 13.34 0 0174.67 184zM160 120v93.33H96V120a13.33 13.33 0 0113.33-13.33h37.33A13.33 13.33 0 01160 120zm85.33 21.34v72h-64v-72A13.32 13.32 0 01194.66 128H232a13.31 13.31 0 0113.33 13.34z"></path><path class="fill-secondary" d="M248 245.34H8a8 8 0 010-16h240a8 8 0 010 16z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bar-chart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bar-chart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bar-chart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.35" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bar-chart-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M216 98.68a10.61 10.61 0 01-7.54-3.12l-41.71-41.71-90.91 10.09a10.64 10.64 0 01-8.72-3L24.46 18.21A10.67 10.67 0 0139.55 3.13l39 39 90.91-10.1a10.52 10.52 0 018.72 3.06l45.33 45.32A10.69 10.69 0 01216 98.68z"></path><path class="fill-secondary" d="M226.67 106.68h-37.33A8 8 0 01183.7 93L221 55.69a8 8 0 0113.67 5.66v37.33a8 8 0 01-8 8z"></path><path class="fill-primary" d="M245.33 184v29.32h-64V184a13.33 13.33 0 0113.33-13.33H232A13.33 13.33 0 01245.33 184zM160 120v93.32H96V120a13.33 13.33 0 0113.33-13.33h37.33A13.33 13.33 0 01160 120zm-85.33 21.35v72h-64v-72A13.33 13.33 0 0124 128h37.33a13.33 13.33 0 0113.34 13.35z"></path><path class="fill-secondary" d="M248 245.35H8a8 8 0 010-16h240a8 8 0 010 16z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.35" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bar-chart-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M216 98.68a10.61 10.61 0 01-7.54-3.12l-41.71-41.71-90.91 10.09a10.64 10.64 0 01-8.72-3L24.46 18.21A10.67 10.67 0 0139.55 3.13l39 39 90.91-10.1a10.52 10.52 0 018.72 3.06l45.33 45.32A10.69 10.69 0 01216 98.68z"></path><path class="fill-secondary" d="M226.67 106.68h-37.33A8 8 0 01183.7 93L221 55.69a8 8 0 0113.67 5.66v37.33a8 8 0 01-8 8z"></path><path class="fill-primary" d="M245.33 184v29.32h-64V184a13.33 13.33 0 0113.33-13.33H232A13.33 13.33 0 01245.33 184zM160 120v93.32H96V120a13.33 13.33 0 0113.33-13.33h37.33A13.33 13.33 0 01160 120zm-85.33 21.35v72h-64v-72A13.33 13.33 0 0124 128h37.33a13.33 13.33 0 0113.34 13.35z"></path><path class="fill-secondary" d="M248 245.35H8a8 8 0 010-16h240a8 8 0 010 16z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bar-chart-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bar-chart-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bar-chart-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.69 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bell.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M224 116.08a10.68 10.68 0 01-10.68-10.67 111.23 111.23 0 00-32.8-79.2 10.67 10.67 0 1115.09-15.09 132.45 132.45 0 0139.06 94.29A10.69 10.69 0 01224 116.08zm-213.33 0A10.68 10.68 0 010 105.41a132.48 132.48 0 0139.05-94.29 10.67 10.67 0 0115.09 15.09 111.28 111.28 0 00-32.8 79.2 10.67 10.67 0 01-10.67 10.67z"></path><path class="fill-primary" d="M217.39 180.4A71.48 71.48 0 01192 125.73V96a74.72 74.72 0 00-64-73.81V10.67a10.68 10.68 0 00-21.35 0v11.52A74.7 74.7 0 0042.67 96v29.74A71.57 71.57 0 0117.2 180.5a18.66 18.66 0 0012.14 32.84h176a18.67 18.67 0 0012-32.94z"></path><path class="fill-secondary" d="M117.34 256a40.05 40.05 0 0039.19-32H78.14a40.09 40.09 0 0039.2 32z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.69 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bell.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M224 116.08a10.68 10.68 0 01-10.68-10.67 111.23 111.23 0 00-32.8-79.2 10.67 10.67 0 1115.09-15.09 132.45 132.45 0 0139.06 94.29A10.69 10.69 0 01224 116.08zm-213.33 0A10.68 10.68 0 010 105.41a132.48 132.48 0 0139.05-94.29 10.67 10.67 0 0115.09 15.09 111.28 111.28 0 00-32.8 79.2 10.67 10.67 0 01-10.67 10.67z"></path><path class="fill-primary" d="M217.39 180.4A71.48 71.48 0 01192 125.73V96a74.72 74.72 0 00-64-73.81V10.67a10.68 10.68 0 00-21.35 0v11.52A74.7 74.7 0 0042.67 96v29.74A71.57 71.57 0 0117.2 180.5a18.66 18.66 0 0012.14 32.84h176a18.67 18.67 0 0012-32.94z"></path><path class="fill-secondary" d="M117.34 256a40.05 40.05 0 0039.19-32H78.14a40.09 40.09 0 0039.2 32z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bell</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bell.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bell.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.33" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/briefcase.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M160 48a10.67 10.67 0 01-10.67-10.67v-16h-42.67v16a10.68 10.68 0 01-21.35 0v-16A21.36 21.36 0 01106.64 0h42.67a21.36 21.36 0 0121.33 21.33v16A10.62 10.62 0 01160 48z"></path><path class="fill-primary" d="M192 112v9.81a8 8 0 01-16 0V112H80v9.81a8 8 0 01-16 0V112H0v72a29.32 29.32 0 0029.33 29.33h197.33A29.31 29.31 0 00256 184v-72zm34.67-80H29.33A29.32 29.32 0 000 61.34V96h64V82.67a8 8 0 0116 0V96h96V82.67a8 8 0 0116 0V96h64V61.33A29.32 29.32 0 00226.67 32z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.33" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/briefcase.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M160 48a10.67 10.67 0 01-10.67-10.67v-16h-42.67v16a10.68 10.68 0 01-21.35 0v-16A21.36 21.36 0 01106.64 0h42.67a21.36 21.36 0 0121.33 21.33v16A10.62 10.62 0 01160 48z"></path><path class="fill-primary" d="M192 112v9.81a8 8 0 01-16 0V112H80v9.81a8 8 0 01-16 0V112H0v72a29.32 29.32 0 0029.33 29.33h197.33A29.31 29.31 0 00256 184v-72zm34.67-80H29.33A29.32 29.32 0 000 61.34V96h64V82.67a8 8 0 0116 0V96h96V82.67a8 8 0 0116 0V96h64V61.33A29.32 29.32 0 00226.67 32z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">briefcase</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/briefcase.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/briefcase.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 226.67 227.74" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bucket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M216 206.4H24a10.67 10.67 0 100 21.34h192a10.67 10.67 0 000-21.34z"></path><path class="fill-primary" d="M89.92 195.71a31.26 31.26 0 0022.18-9.17L192.61 106a10.68 10.68 0 000-15.09L104.77 3.12a10.68 10.68 0 00-15.09 0L9.17 83.63a31.39 31.39 0 000 44.35l58.56 58.56a31.3 31.3 0 0022.19 9.17zm7.31-170L170 98.48l-1.23 1.23H23.6a9.82 9.82 0 01.67-1zm76.1 142.45c0 15.2 12 27.55 26.67 27.55s26.67-12.37 26.67-27.55c0-12.24-15.29-36.4-20-43.5-3-4.5-10.4-4.5-13.36 0-4.69 7.1-19.98 31.26-19.98 43.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 226.67 227.74" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bucket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M216 206.4H24a10.67 10.67 0 100 21.34h192a10.67 10.67 0 000-21.34z"></path><path class="fill-primary" d="M89.92 195.71a31.26 31.26 0 0022.18-9.17L192.61 106a10.68 10.68 0 000-15.09L104.77 3.12a10.68 10.68 0 00-15.09 0L9.17 83.63a31.39 31.39 0 000 44.35l58.56 58.56a31.3 31.3 0 0022.19 9.17zm7.31-170L170 98.48l-1.23 1.23H23.6a9.82 9.82 0 01.67-1zm76.1 142.45c0 15.2 12 27.55 26.67 27.55s26.67-12.37 26.67-27.55c0-12.24-15.29-36.4-20-43.5-3-4.5-10.4-4.5-13.36 0-4.69 7.1-19.98 31.26-19.98 43.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bucket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bucket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bucket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/building.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M250.58 30.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.09 8.09 0 006.26 0c2.48-1.08 60.86-26.48 60.86-78.8V37.71a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.66 10.66 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19L187.82 86l22.47-28.57a10.66 10.66 0 0116.77 13.18z"></path><path class="fill-primary" d="M173.87 175.89c-2.56-1.28-5.23-2.67-8-4.37a20.31 20.31 0 018 4.37z"></path><path class="fill-primary" d="M192 234.67h-24v-22.93a21.33 21.33 0 10-16 0v22.93h-24V149a10.67 10.67 0 10-21.34 0v85.65H85.33V200a8 8 0 00-8-8H50.66a8 8 0 00-8 8v34.67H21.33V69.33H96a10.68 10.68 0 0010.67-10.67V40A18.7 18.7 0 0088 21.31H74.67V10.67a10.67 10.67 0 00-21.34 0v10.67H40A18.69 18.69 0 0021.33 40v8A21.36 21.36 0 000 69.33v176A10.66 10.66 0 0010.67 256H192a10.67 10.67 0 100-21.33z"></path><path class="fill-primary" d="M77.33 144H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0-64H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0 32H50.66a8 8 0 000 16h26.67a8 8 0 000-16z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/building.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M250.58 30.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.09 8.09 0 006.26 0c2.48-1.08 60.86-26.48 60.86-78.8V37.71a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.66 10.66 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19L187.82 86l22.47-28.57a10.66 10.66 0 0116.77 13.18z"></path><path class="fill-primary" d="M173.87 175.89c-2.56-1.28-5.23-2.67-8-4.37a20.31 20.31 0 018 4.37z"></path><path class="fill-primary" d="M192 234.67h-24v-22.93a21.33 21.33 0 10-16 0v22.93h-24V149a10.67 10.67 0 10-21.34 0v85.65H85.33V200a8 8 0 00-8-8H50.66a8 8 0 00-8 8v34.67H21.33V69.33H96a10.68 10.68 0 0010.67-10.67V40A18.7 18.7 0 0088 21.31H74.67V10.67a10.67 10.67 0 00-21.34 0v10.67H40A18.69 18.69 0 0021.33 40v8A21.36 21.36 0 000 69.33v176A10.66 10.66 0 0010.67 256H192a10.67 10.67 0 100-21.33z"></path><path class="fill-primary" d="M77.33 144H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0-64H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0 32H50.66a8 8 0 000 16h26.67a8 8 0 000-16z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">building</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/building.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/building.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bulb.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><circle class="fill-primary" cx="58.67" cy="149.31" r="32"></circle><path class="fill-primary" d="M88 202.65H29.33A29.36 29.36 0 000 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16A29.36 29.36 0 0088 202.65z"></path><circle class="fill-primary" cx="197.33" cy="149.31" r="32"></circle><path class="fill-primary" d="M226.67 202.65H168A29.36 29.36 0 00138.67 232v16a8 8 0 008 8H248a8 8 0 008-8v-16a29.36 29.36 0 00-29.33-29.35z"></path><path class="fill-secondary" d="M149.76 108.48v7.68A11.9 11.9 0 01137.81 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zM176 47.68a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23H106a20 20 0 00-7.79-12.69A47.13 47.13 0 0180 46.73C80.53 21.34 101.76.33 127.25 0a47.34 47.34 0 0134.56 13.88A46.82 46.82 0 01176 47.68z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bulb.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><circle class="fill-primary" cx="58.67" cy="149.31" r="32"></circle><path class="fill-primary" d="M88 202.65H29.33A29.36 29.36 0 000 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16A29.36 29.36 0 0088 202.65z"></path><circle class="fill-primary" cx="197.33" cy="149.31" r="32"></circle><path class="fill-primary" d="M226.67 202.65H168A29.36 29.36 0 00138.67 232v16a8 8 0 008 8H248a8 8 0 008-8v-16a29.36 29.36 0 00-29.33-29.35z"></path><path class="fill-secondary" d="M149.76 108.48v7.68A11.9 11.9 0 01137.81 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zM176 47.68a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23H106a20 20 0 00-7.79-12.69A47.13 47.13 0 0180 46.73C80.53 21.34 101.76.33 127.25 0a47.34 47.34 0 0134.56 13.88A46.82 46.82 0 01176 47.68z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bulb</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bulb.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bulb.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 218.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bullhorn.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M88 208a48.06 48.06 0 01-48-48 45.85 45.85 0 012.26-14.48 10.66 10.66 0 1120.22 6.75 24.28 24.28 0 00-1.15 7.73 26.65 26.65 0 0052.56 6.22 10.67 10.67 0 0120.77 4.87A47.71 47.71 0 0188 208z"></path><path class="fill-primary" d="M248 210.67a8 8 0 01-2.22-.32L5.78 141A8 8 0 010 133.34v-48a8 8 0 015.78-7.68l240-69.32A8 8 0 01256 16v186.7a8 8 0 01-3.2 6.4 8.09 8.09 0 01-4.8 1.57z"></path><path class="fill-primary" d="M245.33 218.67A10.67 10.67 0 01234.66 208V10.67a10.67 10.67 0 1121.34 0V208a10.66 10.66 0 01-10.67 10.67zm-234.66-64A10.66 10.66 0 010 144V74.69a10.67 10.67 0 0121.34 0V144a10.67 10.67 0 01-10.67 10.67z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 218.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/bullhorn.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M88 208a48.06 48.06 0 01-48-48 45.85 45.85 0 012.26-14.48 10.66 10.66 0 1120.22 6.75 24.28 24.28 0 00-1.15 7.73 26.65 26.65 0 0052.56 6.22 10.67 10.67 0 0120.77 4.87A47.71 47.71 0 0188 208z"></path><path class="fill-primary" d="M248 210.67a8 8 0 01-2.22-.32L5.78 141A8 8 0 010 133.34v-48a8 8 0 015.78-7.68l240-69.32A8 8 0 01256 16v186.7a8 8 0 01-3.2 6.4 8.09 8.09 0 01-4.8 1.57z"></path><path class="fill-primary" d="M245.33 218.67A10.67 10.67 0 01234.66 208V10.67a10.67 10.67 0 1121.34 0V208a10.66 10.66 0 01-10.67 10.67zm-234.66-64A10.66 10.66 0 010 144V74.69a10.67 10.67 0 0121.34 0V144a10.67 10.67 0 01-10.67 10.67z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">bullhorn</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bullhorn.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/bullhorn.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/calendar.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M66.67 117.33H40a8 8 0 00-8 8V152a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm0 64H40a8 8 0 00-8 8V216a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm74.66-64h-26.67a8 8 0 00-8 8V152a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm0 64h-26.67a8 8 0 00-8 8V216a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm74.67-64h-26.67a8 8 0 00-8 8V152a8 8 0 008 8H216a8 8 0 008-8v-26.67a8 8 0 00-8-8z"></path><path class="fill-primary" d="M224 32H32A32 32 0 000 64v160a32 32 0 0032 32h192a32 32 0 0032-32V64a32 32 0 00-32-32zm10.67 192A10.67 10.67 0 01224 234.67H32A10.67 10.67 0 0121.33 224V107.09h213.33V224z"></path><path class="fill-secondary" d="M64 0H53.33a10.67 10.67 0 00-10.67 10.67v42.67A10.68 10.68 0 0053.33 64H64a10.67 10.67 0 0010.67-10.66V10.67A10.67 10.67 0 0064 0zm138.67 0H192a10.67 10.67 0 00-10.67 10.67v42.67A10.67 10.67 0 00192 64h10.67a10.67 10.67 0 0010.67-10.67V10.67A10.67 10.67 0 00202.67 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/calendar.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M66.67 117.33H40a8 8 0 00-8 8V152a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm0 64H40a8 8 0 00-8 8V216a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm74.66-64h-26.67a8 8 0 00-8 8V152a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm0 64h-26.67a8 8 0 00-8 8V216a8 8 0 008 8h26.67a8 8 0 008-8v-26.67a8 8 0 00-8-8zm74.67-64h-26.67a8 8 0 00-8 8V152a8 8 0 008 8H216a8 8 0 008-8v-26.67a8 8 0 00-8-8z"></path><path class="fill-primary" d="M224 32H32A32 32 0 000 64v160a32 32 0 0032 32h192a32 32 0 0032-32V64a32 32 0 00-32-32zm10.67 192A10.67 10.67 0 01224 234.67H32A10.67 10.67 0 0121.33 224V107.09h213.33V224z"></path><path class="fill-secondary" d="M64 0H53.33a10.67 10.67 0 00-10.67 10.67v42.67A10.68 10.68 0 0053.33 64H64a10.67 10.67 0 0010.67-10.66V10.67A10.67 10.67 0 0064 0zm138.67 0H192a10.67 10.67 0 00-10.67 10.67v42.67A10.67 10.67 0 00192 64h10.67a10.67 10.67 0 0010.67-10.67V10.67A10.67 10.67 0 00202.67 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">calendar</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/calendar.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/calendar.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/camera.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M53.33 53.33a10.68 10.68 0 01-10.67-10.67V21.33a10.67 10.67 0 0121.34 0v21.33a10.68 10.68 0 01-10.67 10.67z"></path><path class="fill-primary" d="M29.33 32A29.35 29.35 0 000 61.33v112a29.36 29.36 0 0029.33 29.33h197.33A29.36 29.36 0 00256 173.33v-112A29.35 29.35 0 00226.67 32h-5.73l-7.88-15.79A29.19 29.19 0 00186.82 0h-45.64a29.19 29.19 0 00-26.24 16.21L107.06 32zm141.34 32a53.33 53.33 0 11-53.33 53.33A53.39 53.39 0 01170.67 64zM85.33 77.33a8 8 0 01-8 8H40a8 8 0 010-16h37.33a8 8 0 018 8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/camera.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M53.33 53.33a10.68 10.68 0 01-10.67-10.67V21.33a10.67 10.67 0 0121.34 0v21.33a10.68 10.68 0 01-10.67 10.67z"></path><path class="fill-primary" d="M29.33 32A29.35 29.35 0 000 61.33v112a29.36 29.36 0 0029.33 29.33h197.33A29.36 29.36 0 00256 173.33v-112A29.35 29.35 0 00226.67 32h-5.73l-7.88-15.79A29.19 29.19 0 00186.82 0h-45.64a29.19 29.19 0 00-26.24 16.21L107.06 32zm141.34 32a53.33 53.33 0 11-53.33 53.33A53.39 53.39 0 01170.67 64zM85.33 77.33a8 8 0 01-8 8H40a8 8 0 010-16h37.33a8 8 0 018 8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">camera</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/camera.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/camera.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 202.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/chatting.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M245.33 181.33H10.67a10.67 10.67 0 100 21.34h234.67a10.67 10.67 0 100-21.34zM112 66.66a32.94 32.94 0 001 8H42.67v106.67H21.33V74.66a21.39 21.39 0 0121.33-21.33H112zm101.33 34.67h21.33v80h-21.33z"></path><circle class="fill-primary" cx="117.33" cy="117.33" r="21.33"></circle><path class="fill-primary" d="M160 178.66v2.67H74.67v-2.67A29.32 29.32 0 01104 149.33h26.67A29.32 29.32 0 01160 178.66z"></path><path class="fill-secondary" d="M237.33 0h-90.67A18.68 18.68 0 00128 18.66v48a18.7 18.7 0 0018.67 18.67H160v24a8 8 0 0013.89 5.41l27-29.41h36.48A18.69 18.69 0 00256 66.66v-48A18.68 18.68 0 00237.33 0zm-72 50.66a8 8 0 118-8 8 8 0 01-8 8zm26.67 0a8 8 0 118-8 8 8 0 01-8 8zm26.67 0a8 8 0 118-8 8 8 0 01-8 8z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 202.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/chatting.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M245.33 181.33H10.67a10.67 10.67 0 100 21.34h234.67a10.67 10.67 0 100-21.34zM112 66.66a32.94 32.94 0 001 8H42.67v106.67H21.33V74.66a21.39 21.39 0 0121.33-21.33H112zm101.33 34.67h21.33v80h-21.33z"></path><circle class="fill-primary" cx="117.33" cy="117.33" r="21.33"></circle><path class="fill-primary" d="M160 178.66v2.67H74.67v-2.67A29.32 29.32 0 01104 149.33h26.67A29.32 29.32 0 01160 178.66z"></path><path class="fill-secondary" d="M237.33 0h-90.67A18.68 18.68 0 00128 18.66v48a18.7 18.7 0 0018.67 18.67H160v24a8 8 0 0013.89 5.41l27-29.41h36.48A18.69 18.69 0 00256 66.66v-48A18.68 18.68 0 00237.33 0zm-72 50.66a8 8 0 118-8 8 8 0 01-8 8zm26.67 0a8 8 0 118-8 8 8 0 01-8 8zm26.67 0a8 8 0 118-8 8 8 0 01-8 8z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">chatting</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/chatting.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/chatting.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 245.34 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/chatting-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M157.34 154.67a22.61 22.61 0 01-8-1.39v60.05h-128V32A10.7 10.7 0 0132 21.33h74.76a34.77 34.77 0 0129.24-16h20.36A32.68 32.68 0 00138.67 0H32A32.09 32.09 0 000 32v192a32.09 32.09 0 0032 32h106.67a32.09 32.09 0 0032-32v-73.39a24.23 24.23 0 01-13.33 4.06z"></path><circle class="fill-primary" cx="85.34" cy="149.33" r="21.33"></circle><path class="fill-primary" d="M128 210.67v2.67H42.67v-2.67A29.32 29.32 0 0172 181.34h26.67A29.3 29.3 0 01128 210.67z"></path><path class="fill-secondary" d="M226.67 21.33H136A18.69 18.69 0 00117.33 40v48A18.69 18.69 0 00136 106.67h13.33v24a8 8 0 005.1 7.46 7.92 7.92 0 002.9.54 8 8 0 005.89-2.59l27-29.41h36.49A18.69 18.69 0 00245.34 88V40a18.7 18.7 0 00-18.67-18.67zm-72 50.67a8 8 0 118-8 8 8 0 01-8 8zm26.67 0a8 8 0 118-8 8 8 0 01-8 8zM208 72a8 8 0 118-8 8 8 0 01-8 8z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 245.34 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/chatting-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M157.34 154.67a22.61 22.61 0 01-8-1.39v60.05h-128V32A10.7 10.7 0 0132 21.33h74.76a34.77 34.77 0 0129.24-16h20.36A32.68 32.68 0 00138.67 0H32A32.09 32.09 0 000 32v192a32.09 32.09 0 0032 32h106.67a32.09 32.09 0 0032-32v-73.39a24.23 24.23 0 01-13.33 4.06z"></path><circle class="fill-primary" cx="85.34" cy="149.33" r="21.33"></circle><path class="fill-primary" d="M128 210.67v2.67H42.67v-2.67A29.32 29.32 0 0172 181.34h26.67A29.3 29.3 0 01128 210.67z"></path><path class="fill-secondary" d="M226.67 21.33H136A18.69 18.69 0 00117.33 40v48A18.69 18.69 0 00136 106.67h13.33v24a8 8 0 005.1 7.46 7.92 7.92 0 002.9.54 8 8 0 005.89-2.59l27-29.41h36.49A18.69 18.69 0 00245.34 88V40a18.7 18.7 0 00-18.67-18.67zm-72 50.67a8 8 0 118-8 8 8 0 01-8 8zm26.67 0a8 8 0 118-8 8 8 0 01-8 8zM208 72a8 8 0 118-8 8 8 0 01-8 8z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">chatting-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/chatting-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/chatting-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/checked.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M128 64a64 64 0 1064 64 64.06 64.06 0 00-64-64zm34.48 52.59L127.81 154a10.68 10.68 0 01-15.36.29l-18.67-18.71a10.67 10.67 0 1115.08-15.09l10.84 10.83 27.13-29.22a10.68 10.68 0 0115.65 14.53z"></path><path class="fill-secondary" d="M16 128a111.94 111.94 0 01173.14-93.77L173 50.36A8 8 0 00178.67 64h48a8 8 0 008-8V8A8 8 0 00221 2.36l-20.41 20.42A126.79 126.79 0 00128 0 128 128 0 005.47 165a8 8 0 1015.31-4.61A112.8 112.8 0 0116 128zm234.53-36.94a8 8 0 10-15.31 4.61A112 112 0 01128 240a111 111 0 01-61-18.14l16-16.22A8 8 0 0077.33 192h-48a8 8 0 00-8 8.08l.53 48a8 8 0 0013.68 5.54l20-20.26A126.83 126.83 0 00128 256 127.95 127.95 0 00250.53 91z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/checked.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M128 64a64 64 0 1064 64 64.06 64.06 0 00-64-64zm34.48 52.59L127.81 154a10.68 10.68 0 01-15.36.29l-18.67-18.71a10.67 10.67 0 1115.08-15.09l10.84 10.83 27.13-29.22a10.68 10.68 0 0115.65 14.53z"></path><path class="fill-secondary" d="M16 128a111.94 111.94 0 01173.14-93.77L173 50.36A8 8 0 00178.67 64h48a8 8 0 008-8V8A8 8 0 00221 2.36l-20.41 20.42A126.79 126.79 0 00128 0 128 128 0 005.47 165a8 8 0 1015.31-4.61A112.8 112.8 0 0116 128zm234.53-36.94a8 8 0 10-15.31 4.61A112 112 0 01128 240a111 111 0 01-61-18.14l16-16.22A8 8 0 0077.33 192h-48a8 8 0 00-8 8.08l.53 48a8 8 0 0013.68 5.54l20-20.26A126.83 126.83 0 00128 256 127.95 127.95 0 00250.53 91z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">checked</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/checked.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/checked.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/clipboard.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M130.67 64H61.34a18.7 18.7 0 01-18.67-18.67v-16a8 8 0 018-8h17.11a29.33 29.33 0 0156.44 0h17.11a8 8 0 018 8v16A18.68 18.68 0 01130.67 64zm104 160a5.35 5.35 0 01-4.77-2.94l-13.74-27.49a26.82 26.82 0 01-2.82-11.92V85.34a21.33 21.33 0 0142.66 0v96.3a26.82 26.82 0 01-2.82 11.92L239.44 221a5.33 5.33 0 01-4.77 3zm13.75-32.83z"></path><path class="fill-primary" d="M162.67 32H160v13.33a29.36 29.36 0 01-29.33 29.33H61.34A29.36 29.36 0 0132 45.33V32h-2.67A29.35 29.35 0 000 61.33v165.33A29.36 29.36 0 0029.33 256h133.33A29.36 29.36 0 00192 226.67V61.33A29.35 29.35 0 00162.67 32zM152 224H40a8 8 0 010-16h112a8 8 0 010 16zm0-32H40a8 8 0 010-16h112a8 8 0 010 16zm0-32H40a8 8 0 010-16h112a8 8 0 010 16zm0-32H40a8 8 0 010-16h112a8 8 0 010 16z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/clipboard.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M130.67 64H61.34a18.7 18.7 0 01-18.67-18.67v-16a8 8 0 018-8h17.11a29.33 29.33 0 0156.44 0h17.11a8 8 0 018 8v16A18.68 18.68 0 01130.67 64zm104 160a5.35 5.35 0 01-4.77-2.94l-13.74-27.49a26.82 26.82 0 01-2.82-11.92V85.34a21.33 21.33 0 0142.66 0v96.3a26.82 26.82 0 01-2.82 11.92L239.44 221a5.33 5.33 0 01-4.77 3zm13.75-32.83z"></path><path class="fill-primary" d="M162.67 32H160v13.33a29.36 29.36 0 01-29.33 29.33H61.34A29.36 29.36 0 0132 45.33V32h-2.67A29.35 29.35 0 000 61.33v165.33A29.36 29.36 0 0029.33 256h133.33A29.36 29.36 0 00192 226.67V61.33A29.35 29.35 0 00162.67 32zM152 224H40a8 8 0 010-16h112a8 8 0 010 16zm0-32H40a8 8 0 010-16h112a8 8 0 010 16zm0-32H40a8 8 0 010-16h112a8 8 0 010 16zm0-32H40a8 8 0 010-16h112a8 8 0 010 16z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">clipboard</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/clipboard.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/clipboard.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-download.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M128 234.66a8 8 0 01-5.81-2.5l-50.67-53.33a8 8 0 015.81-13.52h24V120a13.33 13.33 0 0113.33-13.32h26.67A13.34 13.34 0 01154.66 120v45.35h24a8 8 0 015.8 13.52l-50.67 53.33a8 8 0 01-5.79 2.46z"></path><path class="fill-primary" d="M199.18 41.87A81.33 81.33 0 00128 0C90.19 0 57.39 26.3 49.1 62.18 21.54 65.07 0 88.22 0 116.26 0 144 21.1 166.64 48.19 170a29.52 29.52 0 012.18-8.22C54.94 151.09 64.54 144 80 144v-24a34.71 34.71 0 0134.67-34.67h26.67A34.7 34.7 0 01176 120v24c15.33 0 25 7 29.63 17.76a28.78 28.78 0 011.89 6.62C235.39 161 256 135.84 256 106a64.81 64.81 0 00-56.82-64.08z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-download.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M128 234.66a8 8 0 01-5.81-2.5l-50.67-53.33a8 8 0 015.81-13.52h24V120a13.33 13.33 0 0113.33-13.32h26.67A13.34 13.34 0 01154.66 120v45.35h24a8 8 0 015.8 13.52l-50.67 53.33a8 8 0 01-5.79 2.46z"></path><path class="fill-primary" d="M199.18 41.87A81.33 81.33 0 00128 0C90.19 0 57.39 26.3 49.1 62.18 21.54 65.07 0 88.22 0 116.26 0 144 21.1 166.64 48.19 170a29.52 29.52 0 012.18-8.22C54.94 151.09 64.54 144 80 144v-24a34.71 34.71 0 0134.67-34.67h26.67A34.7 34.7 0 01176 120v24c15.33 0 25 7 29.63 17.76a28.78 28.78 0 011.89 6.62C235.39 161 256 135.84 256 106a64.81 64.81 0 00-56.82-64.08z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-download</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-download.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-download.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-group.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><circle class="fill-secondary" cx="128" cy="149.33" r="21.33"></circle><path class="fill-secondary" d="M162.67 234.66H93.34a8 8 0 01-8-8v-16a29.36 29.36 0 0129.33-29.33h26.67a29.35 29.35 0 0129.33 29.33v16a8 8 0 01-8 8zm32-64h-14.19a55.46 55.46 0 0116.85 40v2.67H216a8.06 8.06 0 008-8V200a29.32 29.32 0 00-29.33-29.34zm-133.34 0A29.31 29.31 0 0032 200v5.35a8.06 8.06 0 008 8h18.67v-2.67a55.46 55.46 0 0116.85-40z"></path><circle class="fill-secondary" cx="74.67" cy="138.66" r="21.33"></circle><circle class="fill-secondary" cx="181.33" cy="138.66" r="21.33"></circle><path class="fill-primary" d="M27.2 162.94a52.21 52.21 0 018.8-6.56A42.48 42.48 0 01107.73 112a41 41 0 0140.54 0A42.48 42.48 0 01220 156.38a55.09 55.09 0 015.83 4 64.4 64.4 0 00-26.65-118.49A81.31 81.31 0 00128 0C90.19 0 57.39 26.3 49.1 62.18 21.54 65.07 0 88.22 0 116.26c0 19.93 11 37.21 27.2 46.68z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-group.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><circle class="fill-secondary" cx="128" cy="149.33" r="21.33"></circle><path class="fill-secondary" d="M162.67 234.66H93.34a8 8 0 01-8-8v-16a29.36 29.36 0 0129.33-29.33h26.67a29.35 29.35 0 0129.33 29.33v16a8 8 0 01-8 8zm32-64h-14.19a55.46 55.46 0 0116.85 40v2.67H216a8.06 8.06 0 008-8V200a29.32 29.32 0 00-29.33-29.34zm-133.34 0A29.31 29.31 0 0032 200v5.35a8.06 8.06 0 008 8h18.67v-2.67a55.46 55.46 0 0116.85-40z"></path><circle class="fill-secondary" cx="74.67" cy="138.66" r="21.33"></circle><circle class="fill-secondary" cx="181.33" cy="138.66" r="21.33"></circle><path class="fill-primary" d="M27.2 162.94a52.21 52.21 0 018.8-6.56A42.48 42.48 0 01107.73 112a41 41 0 0140.54 0A42.48 42.48 0 01220 156.38a55.09 55.09 0 015.83 4 64.4 64.4 0 00-26.65-118.49A81.31 81.31 0 00128 0C90.19 0 57.39 26.3 49.1 62.18 21.54 65.07 0 88.22 0 116.26c0 19.93 11 37.21 27.2 46.68z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-group</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-group.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-group.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-network.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M193.17 36.14C180.21 14.05 155.12 0 128 0 93.52 0 63.55 22.64 55.62 53.65c-25.27 2.75-44.95 23.09-44.95 47.68 0 26.46 22.79 48 50.79 48h123.6c33.24 0 60.28-25.52 60.28-56.9 0-28.67-22.57-52.62-52.17-56.29z"></path><path class="fill-secondary" d="M245.34 208h-74.67v-8A18.69 18.69 0 00152 181.33h-13.33V144a10.67 10.67 0 10-21.34 0v37.33H104A18.69 18.69 0 0085.33 200v8H10.66a10.67 10.67 0 000 21.34h74.68v8A18.7 18.7 0 00104 256h48a18.7 18.7 0 0018.67-18.68v-8h74.67a10.67 10.67 0 100-21.34z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-network.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M193.17 36.14C180.21 14.05 155.12 0 128 0 93.52 0 63.55 22.64 55.62 53.65c-25.27 2.75-44.95 23.09-44.95 47.68 0 26.46 22.79 48 50.79 48h123.6c33.24 0 60.28-25.52 60.28-56.9 0-28.67-22.57-52.62-52.17-56.29z"></path><path class="fill-secondary" d="M245.34 208h-74.67v-8A18.69 18.69 0 00152 181.33h-13.33V144a10.67 10.67 0 10-21.34 0v37.33H104A18.69 18.69 0 0085.33 200v8H10.66a10.67 10.67 0 000 21.34h74.68v8A18.7 18.7 0 00104 256h48a18.7 18.7 0 0018.67-18.68v-8h74.67a10.67 10.67 0 100-21.34z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-network</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-network.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-network.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-network-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M229 204.06a25.63 25.63 0 00-13.31 3.8l-42.34-29.32V128a10.67 10.67 0 00-21.35 0v56.11a10.63 10.63 0 004.59 8.77l46.9 32.48A26.59 26.59 0 00203 230a26 26 0 1026-26zm0 30.61a4.64 4.64 0 114.64-4.64 4.64 4.64 0 01-4.64 4.64zm-90.33-28.25V128a10.67 10.67 0 10-21.34 0v78.42a26 26 0 1021.34 0zM128 234.67a4.64 4.64 0 114.64-4.64 4.64 4.64 0 01-4.64 4.64z"></path><path class="fill-primary" d="M49.84 172.21l14.1-.18 2.73-1.89V128a26.71 26.71 0 0126.67-26.67 26.41 26.41 0 0117.33 6.57 26.14 26.14 0 0134.66 0 26.53 26.53 0 0144 20.1v42.14l.56.39 16.46-.19a8.5 8.5 0 002.08-.31 65.34 65.34 0 00-9.23-127.65A81 81 0 0049.07 62.91 55.07 55.07 0 000 117.57c0 28.03 21 51.5 49.84 54.64z"></path><path class="fill-secondary" d="M104 128a10.67 10.67 0 10-21.33 0v50.53l-42.33 29.31A25.91 25.91 0 1053 230a25.68 25.68 0 00-.48-4.67l46.89-32.48a10.63 10.63 0 004.59-8.77V128zM27 234.67a4.64 4.64 0 114.65-4.67 4.64 4.64 0 01-4.65 4.67z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-network-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M229 204.06a25.63 25.63 0 00-13.31 3.8l-42.34-29.32V128a10.67 10.67 0 00-21.35 0v56.11a10.63 10.63 0 004.59 8.77l46.9 32.48A26.59 26.59 0 00203 230a26 26 0 1026-26zm0 30.61a4.64 4.64 0 114.64-4.64 4.64 4.64 0 01-4.64 4.64zm-90.33-28.25V128a10.67 10.67 0 10-21.34 0v78.42a26 26 0 1021.34 0zM128 234.67a4.64 4.64 0 114.64-4.64 4.64 4.64 0 01-4.64 4.64z"></path><path class="fill-primary" d="M49.84 172.21l14.1-.18 2.73-1.89V128a26.71 26.71 0 0126.67-26.67 26.41 26.41 0 0117.33 6.57 26.14 26.14 0 0134.66 0 26.53 26.53 0 0144 20.1v42.14l.56.39 16.46-.19a8.5 8.5 0 002.08-.31 65.34 65.34 0 00-9.23-127.65A81 81 0 0049.07 62.91 55.07 55.07 0 000 117.57c0 28.03 21 51.5 49.84 54.64z"></path><path class="fill-secondary" d="M104 128a10.67 10.67 0 10-21.33 0v50.53l-42.33 29.31A25.91 25.91 0 1053 230a25.68 25.68 0 00-.48-4.67l46.89-32.48a10.63 10.63 0 004.59-8.77V128zM27 234.67a4.64 4.64 0 114.65-4.67 4.64 4.64 0 01-4.65 4.67z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-network-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-network-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-network-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-transfer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M173.33 146.66h-64V136a8 8 0 00-13.67-5.66L77 149a8 8 0 000 11.31L95.66 179a8 8 0 0013.67-5.67v-10.69h64a8 8 0 100-16zm5.67 55.68l-18.67-18.68a8 8 0 00-13.66 5.67V200h-64a8 8 0 100 16h64v10.67a8 8 0 0013.66 5.67L179 213.66a8 8 0 000-11.32z"></path><path class="fill-primary" d="M199.15 41.92A81.14 81.14 0 00128 0C90.19 0 57.39 26.3 49.09 62.18 21.54 65.06 0 88.22 0 116.26c0 27.47 21 54.4 58.11 54.4a29.1 29.1 0 01-4.77-16c0-15 8.2-20.34 27.27-39.41a29.26 29.26 0 0148 10.06h44.73a29.35 29.35 0 0129.33 29.33 29 29 0 01-4.56 15.54C230.64 166.5 256 139.1 256 105.92a64.68 64.68 0 00-56.85-64z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/cloud-transfer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M173.33 146.66h-64V136a8 8 0 00-13.67-5.66L77 149a8 8 0 000 11.31L95.66 179a8 8 0 0013.67-5.67v-10.69h64a8 8 0 100-16zm5.67 55.68l-18.67-18.68a8 8 0 00-13.66 5.67V200h-64a8 8 0 100 16h64v10.67a8 8 0 0013.66 5.67L179 213.66a8 8 0 000-11.32z"></path><path class="fill-primary" d="M199.15 41.92A81.14 81.14 0 00128 0C90.19 0 57.39 26.3 49.09 62.18 21.54 65.06 0 88.22 0 116.26c0 27.47 21 54.4 58.11 54.4a29.1 29.1 0 01-4.77-16c0-15 8.2-20.34 27.27-39.41a29.26 29.26 0 0148 10.06h44.73a29.35 29.35 0 0129.33 29.33 29 29 0 01-4.56 15.54C230.64 166.5 256 139.1 256 105.92a64.68 64.68 0 00-56.85-64z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">cloud-transfer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-transfer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/cloud-transfer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/code.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M104 213.34a11 11 0 01-2.59-.32 10.64 10.64 0 01-7.76-12.93l48-192a10.66 10.66 0 0120.68 5.17l-48 192a10.66 10.66 0 01-10.33 8.08z"></path><path class="fill-primary" d="M74.66 181.34a10.57 10.57 0 01-7.54-3.12l-64-64a10.67 10.67 0 010-15.08l64-64a10.67 10.67 0 0115.09 15.08l-56.46 56.47 56.46 56.46a10.65 10.65 0 01-7.55 18.19zm106.65 0a10.55 10.55 0 01-7.53-3.12 10.67 10.67 0 010-15.08l56.46-56.47-56.46-56.46a10.67 10.67 0 1115.08-15.09l64 64a10.68 10.68 0 010 15.09l-64 64a10.58 10.58 0 01-7.55 3.13z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/code.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M104 213.34a11 11 0 01-2.59-.32 10.64 10.64 0 01-7.76-12.93l48-192a10.66 10.66 0 0120.68 5.17l-48 192a10.66 10.66 0 01-10.33 8.08z"></path><path class="fill-primary" d="M74.66 181.34a10.57 10.57 0 01-7.54-3.12l-64-64a10.67 10.67 0 010-15.08l64-64a10.67 10.67 0 0115.09 15.08l-56.46 56.47 56.46 56.46a10.65 10.65 0 01-7.55 18.19zm106.65 0a10.55 10.55 0 01-7.53-3.12 10.67 10.67 0 010-15.08l56.46-56.47-56.46-56.46a10.67 10.67 0 1115.08-15.09l64 64a10.68 10.68 0 010 15.09l-64 64a10.58 10.58 0 01-7.55 3.13z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">code</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/code.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/code.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 213.34 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coffee-cup.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M150.66 256h-88a32.07 32.07 0 01-31.93-30L21.38 78a10.67 10.67 0 1121.29-1.36l9.39 148a10.68 10.68 0 0010.64 10h88a10.68 10.68 0 0010.64-10l9.39-148A10.67 10.67 0 01192 78l-9.39 148a32.07 32.07 0 01-31.95 30z"></path><path class="fill-primary" d="M194.67 85.33h-176A18.69 18.69 0 010 66.66v-5.33a18.69 18.69 0 0118.67-18.67h176a18.68 18.68 0 0118.67 18.67v5.33a18.69 18.69 0 01-18.67 18.67z"></path><path class="fill-primary" d="M181.33 61.34A10.65 10.65 0 01171 53.42l-6.45-24.16a10.67 10.67 0 00-10.3-7.92H59.06a10.69 10.69 0 00-10.31 7.92L42.3 53.42a10.66 10.66 0 11-20.6-5.5l6.44-24.16A32.06 32.06 0 0159.06 0h95.23a32.05 32.05 0 0130.91 23.76l6.45 24.16A10.67 10.67 0 01184.1 61a11.09 11.09 0 01-2.77.34z"></path><path class="fill-secondary" d="M133.62 133.06c-18.2-18.2-45.11-21-60-6.08s-12.12 41.76 6.08 60c10.32 10.32 23.41 15.66 35.54 15.66 9.26 0 18-3.13 24.43-9.57 14.83-14.86 12.11-41.76-6.09-60zm-35.56.33c8 0 17.09 3.84 24.24 11a37 37 0 0110.64 20.13 37.76 37.76 0 00-2.6-2.93c-8.44-8.33-16.52-9-23-9.55-5.28-.43-8.79-.72-13-4.89-3.89-3.94-4.45-7.25-4.88-11.86a19.79 19.79 0 018.6-1.9zm-7 42.24a37.33 37.33 0 01-10.66-20.14c.79 1 1.64 1.95 2.61 2.94 8.43 8.34 16.51 9 23 9.55 5.28.44 8.78.72 13 5 3.89 3.89 4.44 7.21 4.8 11.82-9.1 4.26-22.81.83-32.78-9.12z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 213.34 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coffee-cup.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M150.66 256h-88a32.07 32.07 0 01-31.93-30L21.38 78a10.67 10.67 0 1121.29-1.36l9.39 148a10.68 10.68 0 0010.64 10h88a10.68 10.68 0 0010.64-10l9.39-148A10.67 10.67 0 01192 78l-9.39 148a32.07 32.07 0 01-31.95 30z"></path><path class="fill-primary" d="M194.67 85.33h-176A18.69 18.69 0 010 66.66v-5.33a18.69 18.69 0 0118.67-18.67h176a18.68 18.68 0 0118.67 18.67v5.33a18.69 18.69 0 01-18.67 18.67z"></path><path class="fill-primary" d="M181.33 61.34A10.65 10.65 0 01171 53.42l-6.45-24.16a10.67 10.67 0 00-10.3-7.92H59.06a10.69 10.69 0 00-10.31 7.92L42.3 53.42a10.66 10.66 0 11-20.6-5.5l6.44-24.16A32.06 32.06 0 0159.06 0h95.23a32.05 32.05 0 0130.91 23.76l6.45 24.16A10.67 10.67 0 01184.1 61a11.09 11.09 0 01-2.77.34z"></path><path class="fill-secondary" d="M133.62 133.06c-18.2-18.2-45.11-21-60-6.08s-12.12 41.76 6.08 60c10.32 10.32 23.41 15.66 35.54 15.66 9.26 0 18-3.13 24.43-9.57 14.83-14.86 12.11-41.76-6.09-60zm-35.56.33c8 0 17.09 3.84 24.24 11a37 37 0 0110.64 20.13 37.76 37.76 0 00-2.6-2.93c-8.44-8.33-16.52-9-23-9.55-5.28-.43-8.79-.72-13-4.89-3.89-3.94-4.45-7.25-4.88-11.86a19.79 19.79 0 018.6-1.9zm-7 42.24a37.33 37.33 0 01-10.66-20.14c.79 1 1.64 1.95 2.61 2.94 8.43 8.34 16.51 9 23 9.55 5.28.44 8.78.72 13 5 3.89 3.89 4.44 7.21 4.8 11.82-9.1 4.26-22.81.83-32.78-9.12z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coffee-cup</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coffee-cup.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coffee-cup.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.66 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-primary" d="M128 100.05a9.32 9.32 0 00-9.28-9.39h-17.39v18.67h17.39a9.29 9.29 0 009.28-9.28zm-3.95 25.28h-22.72V144h22.72a9.34 9.34 0 000-18.67z"></path><path class="fill-primary" d="M117.33 0a117.33 117.33 0 10117.33 117.33A117.46 117.46 0 00117.33 0zm16 158.18v4.48a8 8 0 01-16 0V160H112v2.68a8 8 0 01-16 0V160h-2.67a8 8 0 01-8-8V82.66a8 8 0 018-8H96V72a8 8 0 1116 0v2.68h5.33V72a8 8 0 0116 0v7.4a25.16 25.16 0 016 35.2 25.22 25.22 0 01-6 43.6z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.66 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-primary" d="M128 100.05a9.32 9.32 0 00-9.28-9.39h-17.39v18.67h17.39a9.29 9.29 0 009.28-9.28zm-3.95 25.28h-22.72V144h22.72a9.34 9.34 0 000-18.67z"></path><path class="fill-primary" d="M117.33 0a117.33 117.33 0 10117.33 117.33A117.46 117.46 0 00117.33 0zm16 158.18v4.48a8 8 0 01-16 0V160H112v2.68a8 8 0 01-16 0V160h-2.67a8 8 0 01-8-8V82.66a8 8 0 018-8H96V72a8 8 0 1116 0v2.68h5.33V72a8 8 0 0116 0v7.4a25.16 25.16 0 016 35.2 25.22 25.22 0 01-6 43.6z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coin</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-decrease.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-primary" d="M234.66 234.67a10.61 10.61 0 01-7.54-3.12l-61.79-61.79-35.12 35.12a10.65 10.65 0 01-13.15 1.52l-112-69.33a10.67 10.67 0 1111.23-18.14l104.81 64.88 36.71-36.69a10.68 10.68 0 0115.09 0l69.32 69.33a10.68 10.68 0 01-7.56 18.22z"></path><path class="fill-primary" d="M245.31 245.34h-42.67a10.65 10.65 0 01-7.54-18.2l42.68-42.68A10.65 10.65 0 01256 192v42.67a10.66 10.66 0 01-10.69 10.67z"></path><path class="fill-secondary" d="M121.38 93.34H90.66v13.33h30.72a6.67 6.67 0 000-13.33zm1.28-22.62a6.66 6.66 0 00-6.61-6.72H90.66v13.33h25.39a6.62 6.62 0 006.61-6.61z"></path><path class="fill-secondary" d="M101.31 0a90.78 90.78 0 00-90.67 90.67c0 2.79.19 5.54.45 8.27l108.13 67.89 29.13-29.13a24 24 0 0131.36-2.1A90.18 90.18 0 00101.31 0zm21.35 122.54v8.13a8 8 0 01-16 0v-8h-5.33v8a8 8 0 01-16 0v-8h-2.67a8 8 0 01-8-8V56a8 8 0 018-8h2.67v-8a8 8 0 1116 0v8h5.33v-8a8 8 0 0116 0v9.1a22.4 22.4 0 0112.68 33.2 22.52 22.52 0 01-12.68 40.22z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-decrease.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-primary" d="M234.66 234.67a10.61 10.61 0 01-7.54-3.12l-61.79-61.79-35.12 35.12a10.65 10.65 0 01-13.15 1.52l-112-69.33a10.67 10.67 0 1111.23-18.14l104.81 64.88 36.71-36.69a10.68 10.68 0 0115.09 0l69.32 69.33a10.68 10.68 0 01-7.56 18.22z"></path><path class="fill-primary" d="M245.31 245.34h-42.67a10.65 10.65 0 01-7.54-18.2l42.68-42.68A10.65 10.65 0 01256 192v42.67a10.66 10.66 0 01-10.69 10.67z"></path><path class="fill-secondary" d="M121.38 93.34H90.66v13.33h30.72a6.67 6.67 0 000-13.33zm1.28-22.62a6.66 6.66 0 00-6.61-6.72H90.66v13.33h25.39a6.62 6.62 0 006.61-6.61z"></path><path class="fill-secondary" d="M101.31 0a90.78 90.78 0 00-90.67 90.67c0 2.79.19 5.54.45 8.27l108.13 67.89 29.13-29.13a24 24 0 0131.36-2.1A90.18 90.18 0 00101.31 0zm21.35 122.54v8.13a8 8 0 01-16 0v-8h-5.33v8a8 8 0 01-16 0v-8h-2.67a8 8 0 01-8-8V56a8 8 0 018-8h2.67v-8a8 8 0 1116 0v8h5.33v-8a8 8 0 0116 0v9.1a22.4 22.4 0 0112.68 33.2 22.52 22.52 0 01-12.68 40.22z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coin-decrease</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-decrease.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-decrease.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-lock.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M149.33 117.33a10.67 10.67 0 01-10.67-10.67V64a42.67 42.67 0 10-85.33 0v42.67a10.67 10.67 0 11-21.33 0V64a64 64 0 01128 0v42.67a10.66 10.66 0 01-10.67 10.66z"></path><path class="fill-primary" d="M110.72 184H80v13.33h30.72a6.67 6.67 0 000-13.33zm1.28-22.61a6.66 6.66 0 00-6.61-6.72H80V168h25.39a6.64 6.64 0 006.61-6.61z"></path><path class="fill-primary" d="M168 96H24a24 24 0 00-24 24v112a24 24 0 0024 24h144a24 24 0 0024-24V120a24 24 0 00-24-24zm-56 117.2v8.13a8 8 0 11-16 0v-8h-5.33v8a8 8 0 01-16 0v-8H72a8 8 0 01-8-8v-58.66a8 8 0 018-8h2.67v-8a8 8 0 0116 0v8H96v-8a8 8 0 0116 0v9.11A22.41 22.41 0 01124.69 173 22.52 22.52 0 01112 213.2z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-lock.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M149.33 117.33a10.67 10.67 0 01-10.67-10.67V64a42.67 42.67 0 10-85.33 0v42.67a10.67 10.67 0 11-21.33 0V64a64 64 0 01128 0v42.67a10.66 10.66 0 01-10.67 10.66z"></path><path class="fill-primary" d="M110.72 184H80v13.33h30.72a6.67 6.67 0 000-13.33zm1.28-22.61a6.66 6.66 0 00-6.61-6.72H80V168h25.39a6.64 6.64 0 006.61-6.61z"></path><path class="fill-primary" d="M168 96H24a24 24 0 00-24 24v112a24 24 0 0024 24h144a24 24 0 0024-24V120a24 24 0 00-24-24zm-56 117.2v8.13a8 8 0 11-16 0v-8h-5.33v8a8 8 0 01-16 0v-8H72a8 8 0 01-8-8v-58.66a8 8 0 018-8h2.67v-8a8 8 0 0116 0v8H96v-8a8 8 0 0116 0v9.11A22.41 22.41 0 01124.69 173 22.52 22.52 0 01112 213.2z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coin-lock</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-lock.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-lock.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-reload.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M245.33 117.33A10.68 10.68 0 00234.66 128 106.67 106.67 0 11128 21.33a114.53 114.53 0 0155.78 15L170 50.05a10.66 10.66 0 007.54 18.21h46.92a10.68 10.68 0 0010.68-10.67V10.68a10.66 10.66 0 00-18.21-7.54l-17.54 17.54A134.71 134.71 0 00128 0a128 128 0 10128 128 10.67 10.67 0 00-10.67-10.67z"></path><path class="fill-primary" d="M145.78 116.36a6.65 6.65 0 00-6.61-6.72h-25.39V123h25.39a6.61 6.61 0 006.61-6.64zM144.5 139h-30.72v13.33h30.72a6.67 6.67 0 000-13.33z"></path><path class="fill-primary" d="M206.43 82.68h-30.59a22.6 22.6 0 01-15.36-39.24 90.87 90.87 0 1046 39.24zm-60.65 85.48v8.13a8 8 0 01-16 0v-8h-5.33v8a8 8 0 01-16 0v-8h-2.67a8 8 0 01-8-8v-58.65a8 8 0 018-8h2.67v-8a8 8 0 0116 0v8h5.33v-8a8 8 0 0116 0v9.1a22.4 22.4 0 0112.68 33.2 22.52 22.52 0 01-12.68 40.22z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-reload.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M245.33 117.33A10.68 10.68 0 00234.66 128 106.67 106.67 0 11128 21.33a114.53 114.53 0 0155.78 15L170 50.05a10.66 10.66 0 007.54 18.21h46.92a10.68 10.68 0 0010.68-10.67V10.68a10.66 10.66 0 00-18.21-7.54l-17.54 17.54A134.71 134.71 0 00128 0a128 128 0 10128 128 10.67 10.67 0 00-10.67-10.67z"></path><path class="fill-primary" d="M145.78 116.36a6.65 6.65 0 00-6.61-6.72h-25.39V123h25.39a6.61 6.61 0 006.61-6.64zM144.5 139h-30.72v13.33h30.72a6.67 6.67 0 000-13.33z"></path><path class="fill-primary" d="M206.43 82.68h-30.59a22.6 22.6 0 01-15.36-39.24 90.87 90.87 0 1046 39.24zm-60.65 85.48v8.13a8 8 0 01-16 0v-8h-5.33v8a8 8 0 01-16 0v-8h-2.67a8 8 0 01-8-8v-58.65a8 8 0 018-8h2.67v-8a8 8 0 0116 0v8h5.33v-8a8 8 0 0116 0v9.1a22.4 22.4 0 0112.68 33.2 22.52 22.52 0 01-12.68 40.22z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coin-reload</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-reload.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-reload.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-rise.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-primary" d="M10.68 245.34a10.67 10.67 0 01-5.63-19.74l112-69.33a10.68 10.68 0 0113.15 1.52l35.12 35.12 61.79-61.79a10.67 10.67 0 0115.09 15.09l-69.33 69.33a10.68 10.68 0 01-15.09 0l-36.7-36.69-104.82 64.88a10.4 10.4 0 01-5.58 1.61z"></path><path class="fill-primary" d="M245.34 181.34a10.64 10.64 0 01-7.54-3.12l-42.67-42.67a10.66 10.66 0 017.53-18.21h42.68A10.69 10.69 0 01256 128v42.65a10.66 10.66 0 01-6.58 9.86 10.88 10.88 0 01-4.09.81z"></path><path class="fill-secondary" d="M121.4 93.34H90.68v13.33h30.72a6.67 6.67 0 000-13.33zm1.28-22.62a6.66 6.66 0 00-6.61-6.72H90.68v13.33h25.39a6.62 6.62 0 006.61-6.61z"></path><path class="fill-secondary" d="M101.34 0a90.68 90.68 0 00-60.42 158.3 89 89 0 0023.73 15.14L109.91 145a24.14 24.14 0 0129.75 3.38l15.23 15.23A90.53 90.53 0 00101.34 0zm21.34 122.54v8.13a8 8 0 01-16 0v-8h-5.33v8a8 8 0 01-16 0v-8h-2.67a8 8 0 01-8-8V56a8 8 0 018-8h2.67v-8a8 8 0 0116 0v8h5.33v-8a8 8 0 0116 0v9.1a22.41 22.41 0 0112.69 33.2 22.52 22.52 0 01-12.69 40.22z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/coin-rise.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-primary" d="M10.68 245.34a10.67 10.67 0 01-5.63-19.74l112-69.33a10.68 10.68 0 0113.15 1.52l35.12 35.12 61.79-61.79a10.67 10.67 0 0115.09 15.09l-69.33 69.33a10.68 10.68 0 01-15.09 0l-36.7-36.69-104.82 64.88a10.4 10.4 0 01-5.58 1.61z"></path><path class="fill-primary" d="M245.34 181.34a10.64 10.64 0 01-7.54-3.12l-42.67-42.67a10.66 10.66 0 017.53-18.21h42.68A10.69 10.69 0 01256 128v42.65a10.66 10.66 0 01-6.58 9.86 10.88 10.88 0 01-4.09.81z"></path><path class="fill-secondary" d="M121.4 93.34H90.68v13.33h30.72a6.67 6.67 0 000-13.33zm1.28-22.62a6.66 6.66 0 00-6.61-6.72H90.68v13.33h25.39a6.62 6.62 0 006.61-6.61z"></path><path class="fill-secondary" d="M101.34 0a90.68 90.68 0 00-60.42 158.3 89 89 0 0023.73 15.14L109.91 145a24.14 24.14 0 0129.75 3.38l15.23 15.23A90.53 90.53 0 00101.34 0zm21.34 122.54v8.13a8 8 0 01-16 0v-8h-5.33v8a8 8 0 01-16 0v-8h-2.67a8 8 0 01-8-8V56a8 8 0 018-8h2.67v-8a8 8 0 0116 0v8h5.33v-8a8 8 0 0116 0v9.1a22.41 22.41 0 0112.69 33.2 22.52 22.52 0 01-12.69 40.22z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">coin-rise</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-rise.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/coin-rise.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/compare.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M123.22 148.5A8 8 0 00116 144H19.36a8 8 0 00-8 8c0 57.34 46.94 104 104.66 104a104.67 104.67 0 0045.45-10.29 8 8 0 003.76-10.71z"></path><path class="fill-secondary" d="M152 19a8 8 0 00-8 8v95.39a7.93 7.93 0 00.8 3.49l41.73 85.95a8 8 0 0010.65 3.73c36.29-17.48 58.82-53.19 58.82-93.19C256 65.36 209.34 19 152 19z"></path><path class="fill-primary" d="M112 104V8a8 8 0 00-8-8A104.13 104.13 0 000 104a8 8 0 008 8h96a8 8 0 008-8z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/compare.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M123.22 148.5A8 8 0 00116 144H19.36a8 8 0 00-8 8c0 57.34 46.94 104 104.66 104a104.67 104.67 0 0045.45-10.29 8 8 0 003.76-10.71z"></path><path class="fill-secondary" d="M152 19a8 8 0 00-8 8v95.39a7.93 7.93 0 00.8 3.49l41.73 85.95a8 8 0 0010.65 3.73c36.29-17.48 58.82-53.19 58.82-93.19C256 65.36 209.34 19 152 19z"></path><path class="fill-primary" d="M112 104V8a8 8 0 00-8-8A104.13 104.13 0 000 104a8 8 0 008 8h96a8 8 0 008-8z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">compare</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/compare.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/compare.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 232.19" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/computer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M8.93 131A8.93 8.93 0 000 139.91v11.9a32.74 32.74 0 0032.74 32.75h190.52A32.74 32.74 0 00256 151.81v-11.9a8.93 8.93 0 00-8.93-8.93z"></path><path class="fill-primary" d="M0 32.74A32.74 32.74 0 0132.74 0h190.52A32.74 32.74 0 01256 32.74v119.07a32.74 32.74 0 01-32.74 32.75H32.74A32.74 32.74 0 010 151.81zm32.74-14.88a14.88 14.88 0 00-14.88 14.88v119.07a14.89 14.89 0 0014.88 14.89h190.52a14.89 14.89 0 0014.88-14.89V32.74a14.88 14.88 0 00-14.88-14.88z"></path><path class="fill-primary" d="M108.18 167.64a8.93 8.93 0 014 12l-23.82 47.61a8.93 8.93 0 01-16-8l23.84-47.62a8.92 8.92 0 0112-4zm71.44 63.6a8.94 8.94 0 004-12l-23.82-47.61a8.93 8.93 0 00-16 8l23.81 47.63a8.93 8.93 0 0012.01 3.98z"></path><path class="fill-primary" d="M59.53 223.26a8.93 8.93 0 018.94-8.93h119.06a8.93 8.93 0 110 17.86H68.47a8.93 8.93 0 01-8.94-8.93z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 232.19" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/computer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M8.93 131A8.93 8.93 0 000 139.91v11.9a32.74 32.74 0 0032.74 32.75h190.52A32.74 32.74 0 00256 151.81v-11.9a8.93 8.93 0 00-8.93-8.93z"></path><path class="fill-primary" d="M0 32.74A32.74 32.74 0 0132.74 0h190.52A32.74 32.74 0 01256 32.74v119.07a32.74 32.74 0 01-32.74 32.75H32.74A32.74 32.74 0 010 151.81zm32.74-14.88a14.88 14.88 0 00-14.88 14.88v119.07a14.89 14.89 0 0014.88 14.89h190.52a14.89 14.89 0 0014.88-14.89V32.74a14.88 14.88 0 00-14.88-14.88z"></path><path class="fill-primary" d="M108.18 167.64a8.93 8.93 0 014 12l-23.82 47.61a8.93 8.93 0 01-16-8l23.84-47.62a8.92 8.92 0 0112-4zm71.44 63.6a8.94 8.94 0 004-12l-23.82-47.61a8.93 8.93 0 00-16 8l23.81 47.63a8.93 8.93 0 0012.01 3.98z"></path><path class="fill-primary" d="M59.53 223.26a8.93 8.93 0 018.94-8.93h119.06a8.93 8.93 0 110 17.86H68.47a8.93 8.93 0 01-8.94-8.93z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">computer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/computer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/computer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.66 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/conference.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M117.33 42.67a21.34 21.34 0 1121.33-21.34 21.36 21.36 0 01-21.33 21.34zM152 85.33H82.67a8 8 0 01-8-8 24 24 0 0124-24H136a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-secondary" cx="202.66" cy="197.33" r="16"></circle><path class="fill-secondary" d="M226.66 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-secondary" cx="117.33" cy="197.33" r="16"></circle><path class="fill-secondary" d="M141.33 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-secondary" cx="32" cy="197.33" r="16"></circle><path class="fill-secondary" d="M56 256H8a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-primary" d="M181.33 96h-128a10.67 10.67 0 000 21.34h6.46l7 65.17c.73 7.33 6.43 9.49 13.76 9.49a37.16 37.16 0 0173.6 0c7.34 0 13-2.16 13.76-9.49l7-65.17h6.47a10.67 10.67 0 000-21.34z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.66 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/conference.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M117.33 42.67a21.34 21.34 0 1121.33-21.34 21.36 21.36 0 01-21.33 21.34zM152 85.33H82.67a8 8 0 01-8-8 24 24 0 0124-24H136a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-secondary" cx="202.66" cy="197.33" r="16"></circle><path class="fill-secondary" d="M226.66 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-secondary" cx="117.33" cy="197.33" r="16"></circle><path class="fill-secondary" d="M141.33 256h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><circle class="fill-secondary" cx="32" cy="197.33" r="16"></circle><path class="fill-secondary" d="M56 256H8a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-primary" d="M181.33 96h-128a10.67 10.67 0 000 21.34h6.46l7 65.17c.73 7.33 6.43 9.49 13.76 9.49a37.16 37.16 0 0173.6 0c7.34 0 13-2.16 13.76-9.49l7-65.17h6.47a10.67 10.67 0 000-21.34z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">conference</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/conference.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/conference.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.69 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/content.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M224 64h-64a10.68 10.68 0 110-21.35h64A10.68 10.68 0 01224 64zm0-42.66h-64A10.67 10.67 0 11160 0h64a10.67 10.67 0 010 21.34zm0 85.33h-64a10.67 10.67 0 110-21.33h64a10.67 10.67 0 110 21.33zm0 42.67H10.67a10.67 10.67 0 010-21.34H224a10.67 10.67 0 010 21.34zm0 42.66H10.67a10.68 10.68 0 010-21.35H224a10.68 10.68 0 010 21.35zm0 42.67H10.67a10.67 10.67 0 110-21.33H224a10.67 10.67 0 010 21.33z"></path><path class="fill-primary" d="M112 0H16A16 16 0 000 16v74.69a16 16 0 0016 16h96a16 16 0 0016-16V16a16 16 0 00-16-16zm-5.35 21.32v43L91.52 50.75a10.69 10.69 0 00-14.85.56L59.34 69.47 51 61.58A10.66 10.66 0 0036 62L21.34 77.28V21.34z"></path></g></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.69 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/content.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><g data-name="Layer 1"><path class="fill-secondary" d="M224 64h-64a10.68 10.68 0 110-21.35h64A10.68 10.68 0 01224 64zm0-42.66h-64A10.67 10.67 0 11160 0h64a10.67 10.67 0 010 21.34zm0 85.33h-64a10.67 10.67 0 110-21.33h64a10.67 10.67 0 110 21.33zm0 42.67H10.67a10.67 10.67 0 010-21.34H224a10.67 10.67 0 010 21.34zm0 42.66H10.67a10.68 10.68 0 010-21.35H224a10.68 10.68 0 010 21.35zm0 42.67H10.67a10.67 10.67 0 110-21.33H224a10.67 10.67 0 010 21.33z"></path><path class="fill-primary" d="M112 0H16A16 16 0 000 16v74.69a16 16 0 0016 16h96a16 16 0 0016-16V16a16 16 0 00-16-16zm-5.35 21.32v43L91.52 50.75a10.69 10.69 0 00-14.85.56L59.34 69.47 51 61.58A10.66 10.66 0 0036 62L21.34 77.28V21.34z"></path></g></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">content</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/content.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/content.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/controls-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M224 21.33H120.69a73.7 73.7 0 010 64H224a32 32 0 000-64z"></path><circle class="fill-primary" cx="53.33" cy="53.33" r="53.33"></circle><path class="fill-secondary" d="M128 181.33a74 74 0 017.31-32H32a32 32 0 100 64h103.31a74 74 0 01-7.31-32z"></path><circle class="fill-primary" cx="202.67" cy="181.33" r="53.33"></circle></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/controls-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M224 21.33H120.69a73.7 73.7 0 010 64H224a32 32 0 000-64z"></path><circle class="fill-primary" cx="53.33" cy="53.33" r="53.33"></circle><path class="fill-secondary" d="M128 181.33a74 74 0 017.31-32H32a32 32 0 100 64h103.31a74 74 0 01-7.31-32z"></path><circle class="fill-primary" cx="202.67" cy="181.33" r="53.33"></circle></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">controls-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/controls-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/controls-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256.06" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/controls.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M53.34 10.67v42.67H32V10.67a10.66 10.66 0 1121.32 0zm0 96v138.67a10.67 10.67 0 11-21.34 0V106.67zm183.97-53.31H224V10.69a10.67 10.67 0 00-21.34 0v42.69h-13.35a18.68 18.68 0 00-18.67 18.67v16a18.69 18.69 0 0018.67 18.67h13.33v138.67a10.67 10.67 0 1021.34 0V106.72h13.33A18.69 18.69 0 00256 88.05v-16a18.69 18.69 0 00-18.67-18.69zM152 160h-13.34V10.69a10.68 10.68 0 00-21.35 0V160H104a18.7 18.7 0 00-18.69 18.7v16A18.7 18.7 0 00104 213.38h13.33v32a10.68 10.68 0 0021.35 0v-32H152a18.7 18.7 0 0018.68-18.68v-16A18.71 18.71 0 00152 160z"></path><path class="fill-primary" d="M85.34 72v16a18.69 18.69 0 01-18.67 18.67h-48A18.62 18.62 0 010 88V72a18.69 18.69 0 0118.67-18.67h48A18.76 18.76 0 0185.34 72zm85.3 106.67v16A18.69 18.69 0 01152 213.34h-48a18.62 18.62 0 01-18.7-18.67v-16A18.69 18.69 0 01104 160h48a18.76 18.76 0 0118.64 18.67zM256 72v16a18.69 18.69 0 01-18.67 18.67h-48A18.62 18.62 0 01170.64 88V72a18.69 18.69 0 0118.67-18.67h48A18.76 18.76 0 01256 72z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256.06" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/controls.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M53.34 10.67v42.67H32V10.67a10.66 10.66 0 1121.32 0zm0 96v138.67a10.67 10.67 0 11-21.34 0V106.67zm183.97-53.31H224V10.69a10.67 10.67 0 00-21.34 0v42.69h-13.35a18.68 18.68 0 00-18.67 18.67v16a18.69 18.69 0 0018.67 18.67h13.33v138.67a10.67 10.67 0 1021.34 0V106.72h13.33A18.69 18.69 0 00256 88.05v-16a18.69 18.69 0 00-18.67-18.69zM152 160h-13.34V10.69a10.68 10.68 0 00-21.35 0V160H104a18.7 18.7 0 00-18.69 18.7v16A18.7 18.7 0 00104 213.38h13.33v32a10.68 10.68 0 0021.35 0v-32H152a18.7 18.7 0 0018.68-18.68v-16A18.71 18.71 0 00152 160z"></path><path class="fill-primary" d="M85.34 72v16a18.69 18.69 0 01-18.67 18.67h-48A18.62 18.62 0 010 88V72a18.69 18.69 0 0118.67-18.67h48A18.76 18.76 0 0185.34 72zm85.3 106.67v16A18.69 18.69 0 01152 213.34h-48a18.62 18.62 0 01-18.7-18.67v-16A18.69 18.69 0 01104 160h48a18.76 18.76 0 0118.64 18.67zM256 72v16a18.69 18.69 0 01-18.67 18.67h-48A18.62 18.62 0 01170.64 88V72a18.69 18.69 0 0118.67-18.67h48A18.76 18.76 0 01256 72z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">controls</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/controls.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/controls.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/crop.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M245.33 202.66h-160a32 32 0 01-32-32v-160a10.67 10.67 0 0121.34 0v160a10.68 10.68 0 0010.67 10.67h160a10.66 10.66 0 110 21.32z"></path><path class="fill-primary" d="M192 256a10.67 10.67 0 01-10.67-10.67v-160a10.68 10.68 0 00-10.67-10.67h-160a10.67 10.67 0 110-21.33h160a32 32 0 0132 32v160A10.66 10.66 0 01192 256z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/crop.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M245.33 202.66h-160a32 32 0 01-32-32v-160a10.67 10.67 0 0121.34 0v160a10.68 10.68 0 0010.67 10.67h160a10.66 10.66 0 110 21.32z"></path><path class="fill-primary" d="M192 256a10.67 10.67 0 01-10.67-10.67v-160a10.68 10.68 0 00-10.67-10.67h-160a10.67 10.67 0 110-21.33h160a32 32 0 0132 32v160A10.66 10.66 0 01192 256z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">crop</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/crop.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/crop.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/crosshair.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><circle class="fill-primary" cx="128" cy="128" r="53.33"></circle><path class="fill-secondary" d="M128 234.67A106.67 106.67 0 11234.67 128 106.79 106.79 0 01128 234.67zm0-192A85.33 85.33 0 10213.33 128 85.43 85.43 0 00128 42.67z"></path><path class="fill-primary" d="M128 53.34a10.67 10.67 0 01-10.67-10.67v-32a10.67 10.67 0 1121.34 0v32A10.67 10.67 0 01128 53.34zM128 256a10.67 10.67 0 01-10.67-10.67v-32a10.67 10.67 0 1121.34 0v32A10.66 10.66 0 01128 256zM42.67 138.67h-32a10.67 10.67 0 110-21.34h32a10.67 10.67 0 110 21.34zm202.66 0h-32a10.67 10.67 0 010-21.34h32a10.67 10.67 0 010 21.34z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/crosshair.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><circle class="fill-primary" cx="128" cy="128" r="53.33"></circle><path class="fill-secondary" d="M128 234.67A106.67 106.67 0 11234.67 128 106.79 106.79 0 01128 234.67zm0-192A85.33 85.33 0 10213.33 128 85.43 85.43 0 00128 42.67z"></path><path class="fill-primary" d="M128 53.34a10.67 10.67 0 01-10.67-10.67v-32a10.67 10.67 0 1121.34 0v32A10.67 10.67 0 01128 53.34zM128 256a10.67 10.67 0 01-10.67-10.67v-32a10.67 10.67 0 1121.34 0v32A10.66 10.66 0 01128 256zM42.67 138.67h-32a10.67 10.67 0 110-21.34h32a10.67 10.67 0 110 21.34zm202.66 0h-32a10.67 10.67 0 010-21.34h32a10.67 10.67 0 010 21.34z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">crosshair</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/crosshair.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/crosshair.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/currency.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M206.43 82.68h-30.59c-12.5 0-22.67-10.18-22.67-22.67 0-6.56 2.85-12.42 7.31-16.56-10.08-3.89-21.01-6.11-32.48-6.11-50.08 0-90.67 40.59-90.67 90.67s40.59 90.67 90.67 90.67 90.67-40.59 90.67-90.67c0-16.53-4.5-31.98-12.24-45.33zm-82.48 37.33h8.11c12.46 0 22.61 10.14 22.61 22.61 0 11.22-8.08 20.43-18.67 22.32v8.4c0 4.42-3.58 8-8 8s-8-3.58-8-8v-8h-10.67c-4.42 0-8-3.58-8-8s3.58-8 8-8h22.72c3.65 0 6.61-2.98 6.61-6.61s-2.98-6.72-6.61-6.72h-8.11c-12.46 0-22.61-10.14-22.61-22.61 0-11.22 8.08-20.43 18.67-22.32v-8.4c0-4.42 3.58-8 8-8s8 3.58 8 8v8h10.67c4.42 0 8 3.58 8 8s-3.58 8-8 8h-22.72c-3.65 0-6.61 2.98-6.61 6.61-.02 3.74 2.96 6.72 6.61 6.72z"></path><path class="fill-secondary" d="M245.33 117.33c-5.89 0-10.67 4.78-10.67 10.67 0 58.82-47.86 106.67-106.67 106.67S21.33 186.82 21.33 128 69.18 21.33 128 21.33c19.5 0 38.98 5.46 55.78 14.94L170 50.05a10.661 10.661 0 007.54 18.21h46.93c5.89 0 10.67-4.78 10.67-10.67V10.68c0-4.32-2.59-8.21-6.58-9.86-4-1.66-8.58-.75-11.63 2.32l-17.54 17.54C178.4 7.48 153.52 0 128 0 57.42 0 0 57.43 0 128s57.42 128 128 128 128-57.42 128-128c0-5.89-4.77-10.67-10.67-10.67z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/currency.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M206.43 82.68h-30.59c-12.5 0-22.67-10.18-22.67-22.67 0-6.56 2.85-12.42 7.31-16.56-10.08-3.89-21.01-6.11-32.48-6.11-50.08 0-90.67 40.59-90.67 90.67s40.59 90.67 90.67 90.67 90.67-40.59 90.67-90.67c0-16.53-4.5-31.98-12.24-45.33zm-82.48 37.33h8.11c12.46 0 22.61 10.14 22.61 22.61 0 11.22-8.08 20.43-18.67 22.32v8.4c0 4.42-3.58 8-8 8s-8-3.58-8-8v-8h-10.67c-4.42 0-8-3.58-8-8s3.58-8 8-8h22.72c3.65 0 6.61-2.98 6.61-6.61s-2.98-6.72-6.61-6.72h-8.11c-12.46 0-22.61-10.14-22.61-22.61 0-11.22 8.08-20.43 18.67-22.32v-8.4c0-4.42 3.58-8 8-8s8 3.58 8 8v8h10.67c4.42 0 8 3.58 8 8s-3.58 8-8 8h-22.72c-3.65 0-6.61 2.98-6.61 6.61-.02 3.74 2.96 6.72 6.61 6.72z"></path><path class="fill-secondary" d="M245.33 117.33c-5.89 0-10.67 4.78-10.67 10.67 0 58.82-47.86 106.67-106.67 106.67S21.33 186.82 21.33 128 69.18 21.33 128 21.33c19.5 0 38.98 5.46 55.78 14.94L170 50.05a10.661 10.661 0 007.54 18.21h46.93c5.89 0 10.67-4.78 10.67-10.67V10.68c0-4.32-2.59-8.21-6.58-9.86-4-1.66-8.58-.75-11.63 2.32l-17.54 17.54C178.4 7.48 153.52 0 128 0 57.42 0 0 57.43 0 128s57.42 128 128 128 128-57.42 128-128c0-5.89-4.77-10.67-10.67-10.67z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">currency</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/currency.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/currency.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 148.28" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/deal.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M202.67 30.31v70.08a19.84 19.84 0 01-18.35 2.88l-2-.75a32.67 32.67 0 00-6-37.65l-35.95-35.95 28.59-10zM116 78.08l37.65 37v.11a20.72 20.72 0 01-5.33 9.07 22.22 22.22 0 01-16.64 6.4L91.52 90.58a4.21 4.21 0 00-1.39 3.2 4.34 4.34 0 002 3.73l38.08 37.33a21 21 0 01-4.59 6.92 22.37 22.37 0 01-15.89 6.52 21.9 21.9 0 01-15.36-6.2l-23.44-21.23a45.79 45.79 0 00-17.71-10 2.87 2.87 0 00.11-1V20.26L80.74 9a27.8 27.8 0 0124 1.28l-1.7.88A32.66 32.66 0 0085.55 34.9a32.75 32.75 0 009.07 28 32.28 32.28 0 0020 9.28 3.79 3.79 0 00-.75 2.24 4.2 4.2 0 002 3.71z"></path><path class="fill-primary" d="M172.16 99.11a17.19 17.19 0 01-3.31 4.59 22.66 22.66 0 01-14.19 6.93l-38.52-38.4h1.28a33.24 33.24 0 0014.72-3.52l3.41-1.81 18.35-9.28 14.84 14.83.11.11a22.1 22.1 0 013.31 26.55z"></path><path class="fill-secondary" d="M34.67 117.88H8a8 8 0 01-8-8V19.2a8 8 0 018-8h26.67a8 8 0 018 8v90.68a8 8 0 01-8 8zm213.33 0h-26.67a8 8 0 01-8-8V19.2a8 8 0 018-8H248a8 8 0 018 8v90.68a8 8 0 01-8 8z"></path><path class="fill-primary" d="M191.36 12.28c-.11 0-.21-.12-.43-.12l-24.42-10A28.23 28.23 0 00143 3l-29.08 14.6-6.08 3a21.59 21.59 0 00-5.65 34.65 21.64 21.64 0 0025.06 3.94l3.52-1.81L146 49.7l42.44-21.33 14.2 5.87v-15a7.25 7.25 0 01.2-2.12z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 148.28" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/deal.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M202.67 30.31v70.08a19.84 19.84 0 01-18.35 2.88l-2-.75a32.67 32.67 0 00-6-37.65l-35.95-35.95 28.59-10zM116 78.08l37.65 37v.11a20.72 20.72 0 01-5.33 9.07 22.22 22.22 0 01-16.64 6.4L91.52 90.58a4.21 4.21 0 00-1.39 3.2 4.34 4.34 0 002 3.73l38.08 37.33a21 21 0 01-4.59 6.92 22.37 22.37 0 01-15.89 6.52 21.9 21.9 0 01-15.36-6.2l-23.44-21.23a45.79 45.79 0 00-17.71-10 2.87 2.87 0 00.11-1V20.26L80.74 9a27.8 27.8 0 0124 1.28l-1.7.88A32.66 32.66 0 0085.55 34.9a32.75 32.75 0 009.07 28 32.28 32.28 0 0020 9.28 3.79 3.79 0 00-.75 2.24 4.2 4.2 0 002 3.71z"></path><path class="fill-primary" d="M172.16 99.11a17.19 17.19 0 01-3.31 4.59 22.66 22.66 0 01-14.19 6.93l-38.52-38.4h1.28a33.24 33.24 0 0014.72-3.52l3.41-1.81 18.35-9.28 14.84 14.83.11.11a22.1 22.1 0 013.31 26.55z"></path><path class="fill-secondary" d="M34.67 117.88H8a8 8 0 01-8-8V19.2a8 8 0 018-8h26.67a8 8 0 018 8v90.68a8 8 0 01-8 8zm213.33 0h-26.67a8 8 0 01-8-8V19.2a8 8 0 018-8H248a8 8 0 018 8v90.68a8 8 0 01-8 8z"></path><path class="fill-primary" d="M191.36 12.28c-.11 0-.21-.12-.43-.12l-24.42-10A28.23 28.23 0 00143 3l-29.08 14.6-6.08 3a21.59 21.59 0 00-5.65 34.65 21.64 21.64 0 0025.06 3.94l3.52-1.81L146 49.7l42.44-21.33 14.2 5.87v-15a7.25 7.25 0 01.2-2.12z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">deal</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/deal.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/deal.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/delivery-box.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M172 20.57L55.79 80 9.6 57.32 123.71 1A9.43 9.43 0 01132 1zm74.27 36.75l-118.21 58.56-44.27-21.8-6.38-3.25L193.7 31.36l6.4 3.24z"></path><path class="fill-primary" d="M118.59 132.76L118.46 256 5.23 196.91A9.89 9.89 0 010 188.22V74.2l48 23.64v41.55a9.6 9.6 0 1019.2 0v-31.94l6.4 3.12zm137.28-58.43l-118.08 58.31-.13 123.23L256 194.08z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/delivery-box.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M172 20.57L55.79 80 9.6 57.32 123.71 1A9.43 9.43 0 01132 1zm74.27 36.75l-118.21 58.56-44.27-21.8-6.38-3.25L193.7 31.36l6.4 3.24z"></path><path class="fill-primary" d="M118.59 132.76L118.46 256 5.23 196.91A9.89 9.89 0 010 188.22V74.2l48 23.64v41.55a9.6 9.6 0 1019.2 0v-31.94l6.4 3.12zm137.28-58.43l-118.08 58.31-.13 123.23L256 194.08z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">delivery-box</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/delivery-box.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/delivery-box.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/devices.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M226.67 0H80a29.35 29.35 0 00-29.33 29.33v13.33H72v-8a13.34 13.34 0 0113.33-13.33h136a13.34 13.34 0 0113.33 13.33v186.67a13.35 13.35 0 01-13.33 13.33h-82.74A44.07 44.07 0 01132.7 256h94a29.33 29.33 0 0029.3-29.33V29.33A29.35 29.35 0 00226.67 0z"></path><path class="fill-secondary" d="M97.17 64h-77C9 64 0 73.87 0 86v148c0 12.13 9 22 20.16 22h77c11.12 0 20.16-9.87 20.16-22V86c.01-12.13-9.03-22-20.15-22zm5.5 168c0 4.42-3.28 8-7.33 8H22c-4.05 0-7.33-3.58-7.33-8V85.33c0-4.42 3.28-8 7.33-8h3.66c4.05 0 7.33 3.58 7.33 8s3.28 8 7.33 8H77c4.05 0 7.33-3.59 7.33-8s3.28-8 7.33-8h3.66c4 0 7.33 3.58 7.33 8V232z"></path><path class="fill-primary" d="M154.67 186.67A13.33 13.33 0 10168 200a13.35 13.35 0 00-13.33-13.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/devices.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M226.67 0H80a29.35 29.35 0 00-29.33 29.33v13.33H72v-8a13.34 13.34 0 0113.33-13.33h136a13.34 13.34 0 0113.33 13.33v186.67a13.35 13.35 0 01-13.33 13.33h-82.74A44.07 44.07 0 01132.7 256h94a29.33 29.33 0 0029.3-29.33V29.33A29.35 29.35 0 00226.67 0z"></path><path class="fill-secondary" d="M97.17 64h-77C9 64 0 73.87 0 86v148c0 12.13 9 22 20.16 22h77c11.12 0 20.16-9.87 20.16-22V86c.01-12.13-9.03-22-20.15-22zm5.5 168c0 4.42-3.28 8-7.33 8H22c-4.05 0-7.33-3.58-7.33-8V85.33c0-4.42 3.28-8 7.33-8h3.66c4.05 0 7.33 3.58 7.33 8s3.28 8 7.33 8H77c4.05 0 7.33-3.59 7.33-8s3.28-8 7.33-8h3.66c4 0 7.33 3.58 7.33 8V232z"></path><path class="fill-primary" d="M154.67 186.67A13.33 13.33 0 10168 200a13.35 13.35 0 00-13.33-13.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">devices</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/devices.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/devices.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/director.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M163.78 19.12A42.63 42.63 0 00128 0c-18.54 0-34.77 11.81-40.14 28.34C74.26 31 64 42.66 64 56.53c0 15.89 13.42 28.8 29.92 28.8h63.3c19.18 0 34.78-15 34.78-33.43 0-16.22-12.08-29.87-28.22-32.78z"></path><path class="fill-secondary" d="M224 168a8 8 0 01-8-8v-16H40v16a8 8 0 01-16 0v-24a8 8 0 018-8h192a8 8 0 018 8v24a8 8 0 01-8 8z"></path><path class="fill-secondary" d="M128 170.67a8 8 0 01-8-8v-48a8 8 0 0116 0v48a8 8 0 01-8 8z"></path><circle class="fill-primary" cx="32" cy="197.33" r="16"></circle><path class="fill-primary" d="M40 224H24a24 24 0 00-24 24 8 8 0 008 8h48a8 8 0 008-8 24 24 0 00-24-24z"></path><circle class="fill-primary" cx="128" cy="197.33" r="16"></circle><path class="fill-primary" d="M136 224h-16a24 24 0 00-24 24 8 8 0 008 8h48a8 8 0 008-8 24 24 0 00-24-24z"></path><circle class="fill-primary" cx="224" cy="197.33" r="16"></circle><path class="fill-primary" d="M232 224h-16a24 24 0 00-24 24 8 8 0 008 8h48a8 8 0 008-8 24 24 0 00-24-24z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/director.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M163.78 19.12A42.63 42.63 0 00128 0c-18.54 0-34.77 11.81-40.14 28.34C74.26 31 64 42.66 64 56.53c0 15.89 13.42 28.8 29.92 28.8h63.3c19.18 0 34.78-15 34.78-33.43 0-16.22-12.08-29.87-28.22-32.78z"></path><path class="fill-secondary" d="M224 168a8 8 0 01-8-8v-16H40v16a8 8 0 01-16 0v-24a8 8 0 018-8h192a8 8 0 018 8v24a8 8 0 01-8 8z"></path><path class="fill-secondary" d="M128 170.67a8 8 0 01-8-8v-48a8 8 0 0116 0v48a8 8 0 01-8 8z"></path><circle class="fill-primary" cx="32" cy="197.33" r="16"></circle><path class="fill-primary" d="M40 224H24a24 24 0 00-24 24 8 8 0 008 8h48a8 8 0 008-8 24 24 0 00-24-24z"></path><circle class="fill-primary" cx="128" cy="197.33" r="16"></circle><path class="fill-primary" d="M136 224h-16a24 24 0 00-24 24 8 8 0 008 8h48a8 8 0 008-8 24 24 0 00-24-24z"></path><circle class="fill-primary" cx="224" cy="197.33" r="16"></circle><path class="fill-primary" d="M232 224h-16a24 24 0 00-24 24 8 8 0 008 8h48a8 8 0 008-8 24 24 0 00-24-24z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">director</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/director.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/director.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/discussion.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M216 0H40a8.06 8.06 0 00-8 8v90.67A29.32 29.32 0 0061.33 128H88.1a48 48 0 0179.77 0h26.77A29.32 29.32 0 00224 98.67V8a8.06 8.06 0 00-8-8zm-40 66.67a8 8 0 01-4.94 7.39 7.88 7.88 0 01-3.06.61 8 8 0 01-5.66-2.33L154 64l-15.2 13.94a8 8 0 01-9.44 1.06L116 71.33 93.65 93.66a8 8 0 01-11.31-11.31L109 55.68a8 8 0 019.63-1.3l13.58 7.76 10.42-9.53-6.94-7A8 8 0 01141.33 32H168a8 8 0 018 8z"></path><circle class="fill-primary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-primary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-primary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-primary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-primary" cx="128" cy="154.67" r="32"></circle><path class="fill-primary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path><path class="fill-secondary" d="M237.33 16H18.67a8 8 0 010-16h218.67a8 8 0 110 16z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/discussion.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M216 0H40a8.06 8.06 0 00-8 8v90.67A29.32 29.32 0 0061.33 128H88.1a48 48 0 0179.77 0h26.77A29.32 29.32 0 00224 98.67V8a8.06 8.06 0 00-8-8zm-40 66.67a8 8 0 01-4.94 7.39 7.88 7.88 0 01-3.06.61 8 8 0 01-5.66-2.33L154 64l-15.2 13.94a8 8 0 01-9.44 1.06L116 71.33 93.65 93.66a8 8 0 01-11.31-11.31L109 55.68a8 8 0 019.63-1.3l13.58 7.76 10.42-9.53-6.94-7A8 8 0 01141.33 32H168a8 8 0 018 8z"></path><circle class="fill-primary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-primary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-primary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-primary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-primary" cx="128" cy="154.67" r="32"></circle><path class="fill-primary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path><path class="fill-secondary" d="M237.33 16H18.67a8 8 0 010-16h218.67a8 8 0 110 16z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">discussion</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/discussion.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/discussion.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.36" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/dot.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M10.67 58.69A10.66 10.66 0 010 48V32A32 32 0 0132 0h16a10.67 10.67 0 110 21.34H32A10.67 10.67 0 0021.33 32v16a10.66 10.66 0 01-10.66 10.69zm234.66 0A10.67 10.67 0 01234.66 48V32A10.69 10.69 0 00224 21.34h-16A10.67 10.67 0 11208 0h16a32 32 0 0132 32v16a10.64 10.64 0 01-10.65 10.69zM48 213.36H32a32 32 0 01-32-32v-16a10.67 10.67 0 0121.34 0v16A10.68 10.68 0 0032 192h16a10.67 10.67 0 110 21.33zm176 0h-16a10.67 10.67 0 110-21.36h16a10.68 10.68 0 0010.67-10.68v-16a10.67 10.67 0 1121.33 0v16a32 32 0 01-32 32.04z"></path><path class="fill-primary" d="M128 152a45.33 45.33 0 1145.33-45.33A45.39 45.39 0 01128 152zm0-69.33a24 24 0 1024 24 24 24 0 00-24-23.98z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.36" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/dot.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M10.67 58.69A10.66 10.66 0 010 48V32A32 32 0 0132 0h16a10.67 10.67 0 110 21.34H32A10.67 10.67 0 0021.33 32v16a10.66 10.66 0 01-10.66 10.69zm234.66 0A10.67 10.67 0 01234.66 48V32A10.69 10.69 0 00224 21.34h-16A10.67 10.67 0 11208 0h16a32 32 0 0132 32v16a10.64 10.64 0 01-10.65 10.69zM48 213.36H32a32 32 0 01-32-32v-16a10.67 10.67 0 0121.34 0v16A10.68 10.68 0 0032 192h16a10.67 10.67 0 110 21.33zm176 0h-16a10.67 10.67 0 110-21.36h16a10.68 10.68 0 0010.67-10.68v-16a10.67 10.67 0 1121.33 0v16a32 32 0 01-32 32.04z"></path><path class="fill-primary" d="M128 152a45.33 45.33 0 1145.33-45.33A45.39 45.39 0 01128 152zm0-69.33a24 24 0 1024 24 24 24 0 00-24-23.98z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">dot</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/dot.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/dot.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/double-click.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M256 178.08a5.58 5.58 0 01-3.84 5.28l-51.81 17-17 51.8a5.6 5.6 0 01-5.3 3.86 5.5 5.5 0 01-5.17-3.57l-44.5-116.88a4.89 4.89 0 01-.38-2 5.58 5.58 0 015.57-5.57 4.89 4.89 0 012 .38l116.86 44.53a5.54 5.54 0 013.57 5.17z"></path><path class="fill-secondary" d="M117.33 234.67a117.34 117.34 0 11117.33-117.34 109.73 109.73 0 01-1 15.26 10.66 10.66 0 11-21.12-2.89 89.82 89.82 0 00.82-12.36 96 96 0 10-96 96 92.84 92.84 0 0012.38-.81 10.66 10.66 0 112.88 21.13 112.4 112.4 0 01-15.26 1z"></path><path class="fill-secondary" d="M112.27 181.17h-1a64.12 64.12 0 1169.86-69.71 10.67 10.67 0 01-21.25 1.92 42.78 42.78 0 10-46.64 46.57 10.66 10.66 0 01-1 21.27z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/double-click.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M256 178.08a5.58 5.58 0 01-3.84 5.28l-51.81 17-17 51.8a5.6 5.6 0 01-5.3 3.86 5.5 5.5 0 01-5.17-3.57l-44.5-116.88a4.89 4.89 0 01-.38-2 5.58 5.58 0 015.57-5.57 4.89 4.89 0 012 .38l116.86 44.53a5.54 5.54 0 013.57 5.17z"></path><path class="fill-secondary" d="M117.33 234.67a117.34 117.34 0 11117.33-117.34 109.73 109.73 0 01-1 15.26 10.66 10.66 0 11-21.12-2.89 89.82 89.82 0 00.82-12.36 96 96 0 10-96 96 92.84 92.84 0 0012.38-.81 10.66 10.66 0 112.88 21.13 112.4 112.4 0 01-15.26 1z"></path><path class="fill-secondary" d="M112.27 181.17h-1a64.12 64.12 0 1169.86-69.71 10.67 10.67 0 01-21.25 1.92 42.78 42.78 0 10-46.64 46.57 10.66 10.66 0 01-1 21.27z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">double-click</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/double-click.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/double-click.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/e-commerce.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M235.14 0H20.86A20.9 20.9 0 000 20.88v36.4A38.57 38.57 0 0067.46 83a40.83 40.83 0 0060.54-.84 40.84 40.84 0 0060.53.83A38.57 38.57 0 00256 57.28v-36.4A20.86 20.86 0 00235.14 0zm-179 57.28a17.39 17.39 0 01-34.78 0l-.47-35.94h35.22v35.94zm41.25 17.39a20 20 0 01-19.93-19.93v-33.4h39.88v33.4a20 20 0 01-19.95 19.93zm61.22 0a20 20 0 01-19.94-19.93v-33.4h39.89v33.4a20 20 0 01-19.95 19.93zm76.06-17.39a17.39 17.39 0 11-34.78 0v-36l34.78-.35z"></path><path class="fill-primary" d="M234.67 114.78v23.89H21.33v-23.89A61.13 61.13 0 010 103.15v59.52a18.76 18.76 0 0018.67 18.67h81.7c-1.25 5.35-4.58 14-13.46 22.9a5.33 5.33 0 003.78 9.1h74.67a5.33 5.33 0 003.78-9.1c-8.87-8.86-12.28-17.54-13.6-22.9h81.82A18.76 18.76 0 00256 162.67v-59.52a61.53 61.53 0 01-21.33 11.63z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/e-commerce.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M235.14 0H20.86A20.9 20.9 0 000 20.88v36.4A38.57 38.57 0 0067.46 83a40.83 40.83 0 0060.54-.84 40.84 40.84 0 0060.53.83A38.57 38.57 0 00256 57.28v-36.4A20.86 20.86 0 00235.14 0zm-179 57.28a17.39 17.39 0 01-34.78 0l-.47-35.94h35.22v35.94zm41.25 17.39a20 20 0 01-19.93-19.93v-33.4h39.88v33.4a20 20 0 01-19.95 19.93zm61.22 0a20 20 0 01-19.94-19.93v-33.4h39.89v33.4a20 20 0 01-19.95 19.93zm76.06-17.39a17.39 17.39 0 11-34.78 0v-36l34.78-.35z"></path><path class="fill-primary" d="M234.67 114.78v23.89H21.33v-23.89A61.13 61.13 0 010 103.15v59.52a18.76 18.76 0 0018.67 18.67h81.7c-1.25 5.35-4.58 14-13.46 22.9a5.33 5.33 0 003.78 9.1h74.67a5.33 5.33 0 003.78-9.1c-8.87-8.86-12.28-17.54-13.6-22.9h81.82A18.76 18.76 0 00256 162.67v-59.52a61.53 61.53 0 01-21.33 11.63z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">e-commerce</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/e-commerce.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/e-commerce.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/edit.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M152 0H29.33A29.32 29.32 0 000 29.33v165.33A29.32 29.32 0 0029.33 224h78.72l2.35-13.12a29.71 29.71 0 018.11-15.68l62.83-62.72V29.33A29.33 29.33 0 00152 0zM42.67 42.67h42.67a10.67 10.67 0 110 21.33H42.66a10.67 10.67 0 010-21.33zM96 149.33H42.67a10.67 10.67 0 110-21.33H96a10.67 10.67 0 110 21.33zm42.67-42.66h-96a10.67 10.67 0 010-21.34h96a10.67 10.67 0 110 21.34z"></path><path class="fill-secondary" d="M133.63 256a8 8 0 01-7.89-9.38l5.67-32.06a8 8 0 012.22-4.27l79.2-79.2c9.73-9.75 19.28-7.12 24.51-1.89l13.2 13.2a18.69 18.69 0 010 26.4l-79.2 79.2a7.83 7.83 0 01-4.27 2.22l-32 5.67a10.71 10.71 0 01-1.44.11zm32.05-13.65z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/edit.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M152 0H29.33A29.32 29.32 0 000 29.33v165.33A29.32 29.32 0 0029.33 224h78.72l2.35-13.12a29.71 29.71 0 018.11-15.68l62.83-62.72V29.33A29.33 29.33 0 00152 0zM42.67 42.67h42.67a10.67 10.67 0 110 21.33H42.66a10.67 10.67 0 010-21.33zM96 149.33H42.67a10.67 10.67 0 110-21.33H96a10.67 10.67 0 110 21.33zm42.67-42.66h-96a10.67 10.67 0 010-21.34h96a10.67 10.67 0 110 21.34z"></path><path class="fill-secondary" d="M133.63 256a8 8 0 01-7.89-9.38l5.67-32.06a8 8 0 012.22-4.27l79.2-79.2c9.73-9.75 19.28-7.12 24.51-1.89l13.2 13.2a18.69 18.69 0 010 26.4l-79.2 79.2a7.83 7.83 0 01-4.27 2.22l-32 5.67a10.71 10.71 0 01-1.44.11zm32.05-13.65z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">edit</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/edit.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/edit.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/edit-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h74.24l3.76-21.33H32a10.7 10.7 0 01-10.67-10.67V53.34h213.33v50.77a37.66 37.66 0 0117.8 10l3.52 3.52V32A32.06 32.06 0 00224 0z"></path><path class="fill-primary" d="M205.33 69.33H50.66a8.06 8.06 0 00-8 8v48a8.06 8.06 0 008 8h129.8l16-16H58.66v-32h138.67v31.15l.43-.43a45.35 45.35 0 0115.57-10.45V77.33a8.06 8.06 0 00-8-8zm-40.74 79.9l-16.11 16H51.2a8 8 0 010-16zm-32.11 32l-14 14a10.19 10.19 0 00-1.71 2H51.2a8 8 0 010-16z"></path><path class="fill-secondary" d="M250.53 142.4l-13.2-13.2c-5.23-5.23-14.79-7.86-24.51 1.89l-79.2 79.2a8.08 8.08 0 00-2.23 4.27l-5.66 32.06a7.92 7.92 0 002.22 7 8.06 8.06 0 005.68 2.34 10.71 10.71 0 001.39-.11l32-5.67a7.83 7.83 0 004.27-2.22l79.2-79.2a18.7 18.7 0 00.04-26.36z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/edit-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h74.24l3.76-21.33H32a10.7 10.7 0 01-10.67-10.67V53.34h213.33v50.77a37.66 37.66 0 0117.8 10l3.52 3.52V32A32.06 32.06 0 00224 0z"></path><path class="fill-primary" d="M205.33 69.33H50.66a8.06 8.06 0 00-8 8v48a8.06 8.06 0 008 8h129.8l16-16H58.66v-32h138.67v31.15l.43-.43a45.35 45.35 0 0115.57-10.45V77.33a8.06 8.06 0 00-8-8zm-40.74 79.9l-16.11 16H51.2a8 8 0 010-16zm-32.11 32l-14 14a10.19 10.19 0 00-1.71 2H51.2a8 8 0 010-16z"></path><path class="fill-secondary" d="M250.53 142.4l-13.2-13.2c-5.23-5.23-14.79-7.86-24.51 1.89l-79.2 79.2a8.08 8.08 0 00-2.23 4.27l-5.66 32.06a7.92 7.92 0 002.22 7 8.06 8.06 0 005.68 2.34 10.71 10.71 0 001.39-.11l32-5.67a7.83 7.83 0 004.27-2.22l79.2-79.2a18.7 18.7 0 00.04-26.36z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">edit-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/edit-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/edit-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/email-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M170.67 106.67H85.34a10.67 10.67 0 010-21.34h85.33a10.67 10.67 0 110 21.34zM128 64H85.33a10.67 10.67 0 010-21.34H128A10.67 10.67 0 01128 64z"></path><path class="fill-secondary" d="M224 32v84.91l-21.33 11.2V32A10.7 10.7 0 00192 21.33H64A10.7 10.7 0 0053.33 32v96.11L32 116.91V32A32.09 32.09 0 0164 0h128a32.09 32.09 0 0132 32z"></path><path class="fill-secondary" d="M53.33 128.11V144A10.67 10.67 0 1132 144v-27.09zM224 116.91V144a10.67 10.67 0 11-21.34 0v-15.89z"></path><path class="fill-primary" d="M256 98v115.34a32.09 32.09 0 01-32 32H32a32.09 32.09 0 01-32-32V98a32.18 32.18 0 0116.64-28.13L32 61.55v24.32l-5.12 2.77A10.61 10.61 0 0021.33 98v13.33L32 116.91l21.33 11.2 68.48 35.73a13.89 13.89 0 0012.48-.11l68.37-35.63L224 116.91l10.67-5.55V98a10.6 10.6 0 00-5.55-9.39L224 85.87V61.55l15.36 8.32A32.18 32.18 0 01256 98z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/email-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M170.67 106.67H85.34a10.67 10.67 0 010-21.34h85.33a10.67 10.67 0 110 21.34zM128 64H85.33a10.67 10.67 0 010-21.34H128A10.67 10.67 0 01128 64z"></path><path class="fill-secondary" d="M224 32v84.91l-21.33 11.2V32A10.7 10.7 0 00192 21.33H64A10.7 10.7 0 0053.33 32v96.11L32 116.91V32A32.09 32.09 0 0164 0h128a32.09 32.09 0 0132 32z"></path><path class="fill-secondary" d="M53.33 128.11V144A10.67 10.67 0 1132 144v-27.09zM224 116.91V144a10.67 10.67 0 11-21.34 0v-15.89z"></path><path class="fill-primary" d="M256 98v115.34a32.09 32.09 0 01-32 32H32a32.09 32.09 0 01-32-32V98a32.18 32.18 0 0116.64-28.13L32 61.55v24.32l-5.12 2.77A10.61 10.61 0 0021.33 98v13.33L32 116.91l21.33 11.2 68.48 35.73a13.89 13.89 0 0012.48-.11l68.37-35.63L224 116.91l10.67-5.55V98a10.6 10.6 0 00-5.55-9.39L224 85.87V61.55l15.36 8.32A32.18 32.18 0 01256 98z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">email-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/email-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/email-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/emails.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M192 0H21.33A21.36 21.36 0 000 21.33v96a21.36 21.36 0 0021.33 21.33H192a21.36 21.36 0 0021.33-21.33v-96A21.36 21.36 0 00192 0zm0 48l-73.6 37.12A25.12 25.12 0 01106.67 88a24.39 24.39 0 01-11.84-3L21.34 48V30.08l80.85 40.75a9.64 9.64 0 008.85.11l81-40.86z"></path><path class="fill-secondary" d="M234.67 64v53.33A42.72 42.72 0 01192 160H42.67v21.33A21.36 21.36 0 0064 202.66h170.67A21.36 21.36 0 00256 181.33v-96A21.36 21.36 0 00234.67 64z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/emails.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M192 0H21.33A21.36 21.36 0 000 21.33v96a21.36 21.36 0 0021.33 21.33H192a21.36 21.36 0 0021.33-21.33v-96A21.36 21.36 0 00192 0zm0 48l-73.6 37.12A25.12 25.12 0 01106.67 88a24.39 24.39 0 01-11.84-3L21.34 48V30.08l80.85 40.75a9.64 9.64 0 008.85.11l81-40.86z"></path><path class="fill-secondary" d="M234.67 64v53.33A42.72 42.72 0 01192 160H42.67v21.33A21.36 21.36 0 0064 202.66h170.67A21.36 21.36 0 00256 181.33v-96A21.36 21.36 0 00234.67 64z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">emails</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/emails.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/emails.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/employees.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M72.11 86.51l-3.52-21 1.41-1.4-4.36-4.48a24.12 24.12 0 01-5.78-24.43c.11-.32.2-.53.32-.85l-1.4-.21-9-18.88a8 8 0 00-14.49 0l-8.88 19-19.69 3.07a8 8 0 00-6.29 5.44 7.94 7.94 0 001.92 8.11l14.51 14.83-3.42 21A8.07 8.07 0 0021.33 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8 8 0 003.21-7.89zm183.46-44.06a7.85 7.85 0 00-6.4-5.33l-19.73-3-9-18.88a8 8 0 00-14.5 0l-8.86 19-1.17.21c0 .11.11.21.11.32a23.76 23.76 0 01-5.44 24.32L185.81 64l1.71 1.71-3.41 21A8.07 8.07 0 00192 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8.06 8.06 0 003.2-7.89l-3.52-21 14.51-14.92a8.09 8.09 0 001.81-8.13z"></path><path class="fill-primary" d="M100.18 106.67a8 8 0 01-7.91-9.25l4.61-28.8L77 48.37a8 8 0 014.46-13.51l27.09-4.22 12.11-26a8 8 0 017.2-4.64 8 8 0 017.23 4.58l12.29 25.9 27.12 4.05A8 8 0 01179.09 48l-19.78 20.38 4.8 28.77a8 8 0 01-11.74 8.34l-24.19-13.25-24.12 13.42a7.94 7.94 0 01-3.88 1z"></path><circle class="fill-secondary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-secondary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-secondary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-secondary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-primary" cx="128" cy="154.67" r="32"></circle><path class="fill-primary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/employees.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M72.11 86.51l-3.52-21 1.41-1.4-4.36-4.48a24.12 24.12 0 01-5.78-24.43c.11-.32.2-.53.32-.85l-1.4-.21-9-18.88a8 8 0 00-14.49 0l-8.88 19-19.69 3.07a8 8 0 00-6.29 5.44 7.94 7.94 0 001.92 8.11l14.51 14.83-3.42 21A8.07 8.07 0 0021.33 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8 8 0 003.21-7.89zm183.46-44.06a7.85 7.85 0 00-6.4-5.33l-19.73-3-9-18.88a8 8 0 00-14.5 0l-8.86 19-1.17.21c0 .11.11.21.11.32a23.76 23.76 0 01-5.44 24.32L185.81 64l1.71 1.71-3.41 21A8.07 8.07 0 00192 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8.06 8.06 0 003.2-7.89l-3.52-21 14.51-14.92a8.09 8.09 0 001.81-8.13z"></path><path class="fill-primary" d="M100.18 106.67a8 8 0 01-7.91-9.25l4.61-28.8L77 48.37a8 8 0 014.46-13.51l27.09-4.22 12.11-26a8 8 0 017.2-4.64 8 8 0 017.23 4.58l12.29 25.9 27.12 4.05A8 8 0 01179.09 48l-19.78 20.38 4.8 28.77a8 8 0 01-11.74 8.34l-24.19-13.25-24.12 13.42a7.94 7.94 0 01-3.88 1z"></path><circle class="fill-secondary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-secondary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-secondary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-secondary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-primary" cx="128" cy="154.67" r="32"></circle><path class="fill-primary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">employees</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/employees.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/employees.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.67 256.03" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/feather.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M46.16 202.66a8 8 0 01-7.73-6C13.79 102.26 59.6 36.21 174.56.36a8 8 0 0110.09 5.48c7.2 25.73 9.14 50.4 5.78 73.32a8 8 0 01-3.43 5.47l-38.74 26.16 20.34 10.49a8 8 0 013.17 11.27C146.62 174 101 199.52 46.64 202.66z"></path><path class="fill-secondary" d="M42.91 247.54a10.66 10.66 0 018.22-12.64l45.92-9.73a56.7 56.7 0 0128.1 1.39l21.34 7.06c2.58.85 9.44 1.6 14.21.08l24.91-7.7c11.57-3.62 26.92-1.81 35.54 4.28l9 6.4a10.67 10.67 0 01-12.32 17.43l-9-6.4c-2.5-1.79-11.07-3.15-16.86-1.33l-24.92 7.74a47.38 47.38 0 01-27.26-.2l-21.31-7.06a35.17 35.17 0 00-17-.77l-45.91 9.73a10.72 10.72 0 01-12.66-8.28z"></path><path class="fill-primary" d="M4.4 254a10.65 10.65 0 01-2.35-14.9l85.32-117.37a10.67 10.67 0 0117.25 12.55L19.29 251.6A10.65 10.65 0 014.4 254z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.67 256.03" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/feather.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M46.16 202.66a8 8 0 01-7.73-6C13.79 102.26 59.6 36.21 174.56.36a8 8 0 0110.09 5.48c7.2 25.73 9.14 50.4 5.78 73.32a8 8 0 01-3.43 5.47l-38.74 26.16 20.34 10.49a8 8 0 013.17 11.27C146.62 174 101 199.52 46.64 202.66z"></path><path class="fill-secondary" d="M42.91 247.54a10.66 10.66 0 018.22-12.64l45.92-9.73a56.7 56.7 0 0128.1 1.39l21.34 7.06c2.58.85 9.44 1.6 14.21.08l24.91-7.7c11.57-3.62 26.92-1.81 35.54 4.28l9 6.4a10.67 10.67 0 01-12.32 17.43l-9-6.4c-2.5-1.79-11.07-3.15-16.86-1.33l-24.92 7.74a47.38 47.38 0 01-27.26-.2l-21.31-7.06a35.17 35.17 0 00-17-.77l-45.91 9.73a10.72 10.72 0 01-12.66-8.28z"></path><path class="fill-primary" d="M4.4 254a10.65 10.65 0 01-2.35-14.9l85.32-117.37a10.67 10.67 0 0117.25 12.55L19.29 251.6A10.65 10.65 0 014.4 254z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">feather</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/feather.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/feather.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/gamepad.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M122.66 120A10.67 10.67 0 01112 109.31V96a42.71 42.71 0 0142.67-42.65h58.67A21.36 21.36 0 00234.66 32V10.67a10.67 10.67 0 1121.33 0V32a42.71 42.71 0 01-42.67 42.66h-58.67A21.35 21.35 0 00133.32 96v13.33A10.67 10.67 0 01122.66 120z"></path><path class="fill-primary" d="M40.81 256a38.6 38.6 0 01-18.34-4.45C9.16 244.51 1.24 230.1.2 211c-1.63-29.89 6.78-59 25.69-89C40.82 98.27 58.73 91.42 85.7 99c12 3.37 24.61 6.57 36.77 6.24 10.91-.2 22.7-2.18 37.14-6.24 27-7.6 44.89-.74 59.82 22.94 18.93 30 27.33 59.15 25.7 89-1 19.12-9 33.54-22.28 40.58-13.93 7.37-31.44 5.52-49.26-5.24-12.43-7.48-23.87-15.13-34.38-22.28a30.09 30.09 0 00-33.09 0c-10.51 7.15-21.94 14.78-34.39 22.28-10.65 6.45-21.2 9.7-30.92 9.7zM66.6 117.3c-9.46 0-15.59 4.8-22.66 16-16.49 26.16-23.84 51.19-22.45 76.5.63 11.36 4.52 19.49 11 22.89 6.95 3.68 17.27 2 28.29-4.65 12-7.23 23.14-14.67 33.39-21.65 16.82-11.46 40.28-11.46 57.09 0 10.26 7 21.39 14.42 33.39 21.65 11 6.64 21.33 8.33 28.29 4.65 6.45-3.4 10.34-11.53 11-22.89 1.38-25.31-6-50.34-22.45-76.5-9.92-15.74-18-18.86-36-13.79-16.24 4.58-29.76 6.8-42.54 7-14.92.16-29.41-3.23-42.93-7a50.26 50.26 0 00-13.42-2.21zm56.06-1.41z"></path><path class="fill-primary" d="M88 178.64H50.66a8 8 0 010-16H88a8 8 0 110 16z"></path><path class="fill-primary" d="M69.32 197.3a8 8 0 01-8-8V152a8 8 0 0116 0v37.3a8 8 0 01-8 8zm112-5.3a21.33 21.33 0 1121.33-21.33A21.36 21.36 0 01181.32 192z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/gamepad.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M122.66 120A10.67 10.67 0 01112 109.31V96a42.71 42.71 0 0142.67-42.65h58.67A21.36 21.36 0 00234.66 32V10.67a10.67 10.67 0 1121.33 0V32a42.71 42.71 0 01-42.67 42.66h-58.67A21.35 21.35 0 00133.32 96v13.33A10.67 10.67 0 01122.66 120z"></path><path class="fill-primary" d="M40.81 256a38.6 38.6 0 01-18.34-4.45C9.16 244.51 1.24 230.1.2 211c-1.63-29.89 6.78-59 25.69-89C40.82 98.27 58.73 91.42 85.7 99c12 3.37 24.61 6.57 36.77 6.24 10.91-.2 22.7-2.18 37.14-6.24 27-7.6 44.89-.74 59.82 22.94 18.93 30 27.33 59.15 25.7 89-1 19.12-9 33.54-22.28 40.58-13.93 7.37-31.44 5.52-49.26-5.24-12.43-7.48-23.87-15.13-34.38-22.28a30.09 30.09 0 00-33.09 0c-10.51 7.15-21.94 14.78-34.39 22.28-10.65 6.45-21.2 9.7-30.92 9.7zM66.6 117.3c-9.46 0-15.59 4.8-22.66 16-16.49 26.16-23.84 51.19-22.45 76.5.63 11.36 4.52 19.49 11 22.89 6.95 3.68 17.27 2 28.29-4.65 12-7.23 23.14-14.67 33.39-21.65 16.82-11.46 40.28-11.46 57.09 0 10.26 7 21.39 14.42 33.39 21.65 11 6.64 21.33 8.33 28.29 4.65 6.45-3.4 10.34-11.53 11-22.89 1.38-25.31-6-50.34-22.45-76.5-9.92-15.74-18-18.86-36-13.79-16.24 4.58-29.76 6.8-42.54 7-14.92.16-29.41-3.23-42.93-7a50.26 50.26 0 00-13.42-2.21zm56.06-1.41z"></path><path class="fill-primary" d="M88 178.64H50.66a8 8 0 010-16H88a8 8 0 110 16z"></path><path class="fill-primary" d="M69.32 197.3a8 8 0 01-8-8V152a8 8 0 0116 0v37.3a8 8 0 01-8 8zm112-5.3a21.33 21.33 0 1121.33-21.33A21.36 21.36 0 01181.32 192z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">gamepad</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/gamepad.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/gamepad.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 253.45 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/gears.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M158.75 170.67a70.52 70.52 0 000-21.25l17.64-13.84a10.75 10.75 0 002.65-13.72l-11.37-19.72a10.73 10.73 0 00-13.24-4.56L133.66 106a67.43 67.43 0 00-18.35-10.61l-3.15-22.19A10.71 10.71 0 00101.6 64H78.86a10.71 10.71 0 00-10.56 9.17l-3.15 22.19A67.44 67.44 0 0046.89 106L26 97.58a10.74 10.74 0 00-13.21 4.56L1.42 121.86a10.73 10.73 0 002.67 13.74l17.62 13.74a68.44 68.44 0 00-.82 10.66 70 70 0 00.8 10.58L4.06 184.42a10.75 10.75 0 00-2.66 13.72l11.38 19.72A10.76 10.76 0 0026 222.42l20.79-8.37a67.43 67.43 0 0018.35 10.61l3.15 22.19A10.71 10.71 0 0078.86 256h22.74a10.71 10.71 0 0010.56-9.17l3.15-22.19a67.24 67.24 0 0018.25-10.59l20.88 8.37a10.72 10.72 0 0013.22-4.56L179 198.14a10.73 10.73 0 00-2.68-13.74zm-68.53 26.66A37.33 37.33 0 11127.55 160a37.37 37.37 0 01-37.33 37.33z"></path><path class="fill-secondary" d="M241.72 58.34a39.74 39.74 0 00.52-5 36.19 36.19 0 00-.52-5l9.6-7.26a5.31 5.31 0 001.4-6.92l-8.61-14.96a5.3 5.3 0 00-6.69-2.2l-11.06 4.67a39.61 39.61 0 00-8.75-5.21l-1.47-11.79A5.32 5.32 0 00210.86 0h-17.25a5.33 5.33 0 00-5.29 4.67l-1.48 11.75a39.06 39.06 0 00-8.73 5.2l-11.06-4.68a5.34 5.34 0 00-6.69 2.24l-8.62 15a5.33 5.33 0 001.39 6.82l9.6 7.26a39.73 39.73 0 00-.51 5 37.79 37.79 0 00.51 5l-9.6 7.26a5.32 5.32 0 00-1.39 6.92l8.62 14.94a5.3 5.3 0 006.69 2.24L178.11 85a40.22 40.22 0 008.73 5.2l1.48 11.8a5.33 5.33 0 005.29 4.67h17.25a5.34 5.34 0 005.3-4.67l1.47-11.74a39.37 39.37 0 008.73-5.2l11.06 4.67a5.34 5.34 0 006.69-2.24l8.62-14.94a5.33 5.33 0 00-1.39-6.92zm-39.5 16.33a21.33 21.33 0 1121.33-21.33 21.33 21.33 0 01-21.33 21.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 253.45 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/gears.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M158.75 170.67a70.52 70.52 0 000-21.25l17.64-13.84a10.75 10.75 0 002.65-13.72l-11.37-19.72a10.73 10.73 0 00-13.24-4.56L133.66 106a67.43 67.43 0 00-18.35-10.61l-3.15-22.19A10.71 10.71 0 00101.6 64H78.86a10.71 10.71 0 00-10.56 9.17l-3.15 22.19A67.44 67.44 0 0046.89 106L26 97.58a10.74 10.74 0 00-13.21 4.56L1.42 121.86a10.73 10.73 0 002.67 13.74l17.62 13.74a68.44 68.44 0 00-.82 10.66 70 70 0 00.8 10.58L4.06 184.42a10.75 10.75 0 00-2.66 13.72l11.38 19.72A10.76 10.76 0 0026 222.42l20.79-8.37a67.43 67.43 0 0018.35 10.61l3.15 22.19A10.71 10.71 0 0078.86 256h22.74a10.71 10.71 0 0010.56-9.17l3.15-22.19a67.24 67.24 0 0018.25-10.59l20.88 8.37a10.72 10.72 0 0013.22-4.56L179 198.14a10.73 10.73 0 00-2.68-13.74zm-68.53 26.66A37.33 37.33 0 11127.55 160a37.37 37.37 0 01-37.33 37.33z"></path><path class="fill-secondary" d="M241.72 58.34a39.74 39.74 0 00.52-5 36.19 36.19 0 00-.52-5l9.6-7.26a5.31 5.31 0 001.4-6.92l-8.61-14.96a5.3 5.3 0 00-6.69-2.2l-11.06 4.67a39.61 39.61 0 00-8.75-5.21l-1.47-11.79A5.32 5.32 0 00210.86 0h-17.25a5.33 5.33 0 00-5.29 4.67l-1.48 11.75a39.06 39.06 0 00-8.73 5.2l-11.06-4.68a5.34 5.34 0 00-6.69 2.24l-8.62 15a5.33 5.33 0 001.39 6.82l9.6 7.26a39.73 39.73 0 00-.51 5 37.79 37.79 0 00.51 5l-9.6 7.26a5.32 5.32 0 00-1.39 6.92l8.62 14.94a5.3 5.3 0 006.69 2.24L178.11 85a40.22 40.22 0 008.73 5.2l1.48 11.8a5.33 5.33 0 005.29 4.67h17.25a5.34 5.34 0 005.3-4.67l1.47-11.74a39.37 39.37 0 008.73-5.2l11.06 4.67a5.34 5.34 0 006.69-2.24l8.62-14.94a5.33 5.33 0 00-1.39-6.92zm-39.5 16.33a21.33 21.33 0 1121.33-21.33 21.33 21.33 0 01-21.33 21.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">gears</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/gears.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/gears.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/globe-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M128.11 256h-.24a126.37 126.37 0 01-22-1.84 8 8 0 112.72-15.76A114.68 114.68 0 00128 240a8.06 8.06 0 018.07 8 8 8 0 01-7.94 8zm33.52-12.5a8 8 0 014.77-10.25 112.18 112.18 0 0017.66-8.25 8 8 0 018 13.85 128.36 128.36 0 01-20.19 9.46 8 8 0 01-10.26-4.79zm-97.5-4.56a128.83 128.83 0 01-18.27-12.78 8 8 0 1110.25-12.27 114.33 114.33 0 0016 11.2 8 8 0 11-8 13.85zm150.69-27.71a8 8 0 01-1-11.26A112.91 112.91 0 00225 184a8 8 0 0113.86 8 130.3 130.3 0 01-12.78 18.26 8 8 0 01-11.28 1zm-197.59-19A128.41 128.41 0 017.76 172a8 8 0 1115-5.49 112.8 112.8 0 008.29 17.67 8 8 0 11-13.84 8zM244.8 156.7a8 8 0 01-6.5-9.26A112.3 112.3 0 00240 128a8.23 8.23 0 018-8.26 7.81 7.81 0 018 8.76 124.89 124.89 0 01-1.92 21.72 8 8 0 01-9.26 6.48zM8 136.13a7.89 7.89 0 01-8-7.87s.61-15 1.86-22.18a8 8 0 1115.76 2.7A114.47 114.47 0 0016 128a8.09 8.09 0 01-8 8.13zm225.1-46.88a110.41 110.41 0 00-8.32-17.63 8 8 0 0113.83-8.08 129 129 0 019.52 20.17 8 8 0 01-15 5.54zM19.9 75.18A8 8 0 0117 64.26 126.41 126.41 0 0129.73 46 8 8 0 1142 56.21a112.72 112.72 0 00-11.17 16 8 8 0 01-10.93 3zm179.76-33.24a113.17 113.17 0 00-16-11.16 8 8 0 117.95-13.87 127.39 127.39 0 0118.3 12.75 8 8 0 01-10.24 12.28zM60.78 28.26a8 8 0 012.88-11 128 128 0 0120.18-9.44 8 8 0 115.52 15 112.17 112.17 0 00-17.63 8.31 8 8 0 01-11-2.88zm86.29-10.64A112.4 112.4 0 00128 16a8.17 8.17 0 01-8.19-8 7.84 7.84 0 017.81-8h.38a127.72 127.72 0 0121.8 1.86 8 8 0 01-2.71 15.76z"></path><path class="fill-primary" d="M128 32a96 96 0 1096 96 96.11 96.11 0 00-96-96zm62.61 145.66a103 103 0 00-14.49-7.76 160.22 160.22 0 005-33.9h26.48a79.47 79.47 0 01-17.01 41.66zM48.4 136h26.48a161.6 161.6 0 005 33.9 104.11 104.11 0 00-14.5 7.76A79.47 79.47 0 0148.4 136zm17-57.66a103.14 103.14 0 0014.5 7.76 160.2 160.2 0 00-5 33.9H48.4a79.47 79.47 0 0117-41.66zM120 79.7a106.49 106.49 0 01-20-3.43c5.41-13 12.6-22.11 20-26zm0 16V120H90.86A145.12 145.12 0 0195 91.49a122.72 122.72 0 0025 4.21zm0 40.3v24.3a121.26 121.26 0 00-25 4.23A144.37 144.37 0 0190.86 136H120zm0 40.3v29.48c-7.4-3.94-14.59-13-20-26a104.12 104.12 0 0120-3.44zm16 0a106.21 106.21 0 0120 3.43c-5.4 13-12.59 22.11-20 26zm0-16V136h29.1a144.37 144.37 0 01-4.16 28.51 122.49 122.49 0 00-25-4.21zm0-40.3V95.7a121.14 121.14 0 0025-4.23 142.91 142.91 0 014.1 28.53H136zm0-40.3V50.24c7.41 3.94 14.6 13 20 26a104.36 104.36 0 01-20 3.46zm27.94-23.08a80.19 80.19 0 0115.25 10 88.15 88.15 0 01-8.19 4.21 98.1 98.1 0 00-7.12-14.21zm-79 14.21a86.72 86.72 0 01-8.12-4.25 80.12 80.12 0 0115.24-10 95.14 95.14 0 00-7.12 14.25zm0 114.34a98.11 98.11 0 007.12 14.21 80.12 80.12 0 01-15.24-10 86.72 86.72 0 018.12-4.21zm86.1 0a88.15 88.15 0 018.13 4.25 80.19 80.19 0 01-15.25 10 99.14 99.14 0 007.08-14.25zM181.1 120a161 161 0 00-5-33.9 104.57 104.57 0 0014.49-7.76 79.47 79.47 0 0117 41.66z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/globe-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M128.11 256h-.24a126.37 126.37 0 01-22-1.84 8 8 0 112.72-15.76A114.68 114.68 0 00128 240a8.06 8.06 0 018.07 8 8 8 0 01-7.94 8zm33.52-12.5a8 8 0 014.77-10.25 112.18 112.18 0 0017.66-8.25 8 8 0 018 13.85 128.36 128.36 0 01-20.19 9.46 8 8 0 01-10.26-4.79zm-97.5-4.56a128.83 128.83 0 01-18.27-12.78 8 8 0 1110.25-12.27 114.33 114.33 0 0016 11.2 8 8 0 11-8 13.85zm150.69-27.71a8 8 0 01-1-11.26A112.91 112.91 0 00225 184a8 8 0 0113.86 8 130.3 130.3 0 01-12.78 18.26 8 8 0 01-11.28 1zm-197.59-19A128.41 128.41 0 017.76 172a8 8 0 1115-5.49 112.8 112.8 0 008.29 17.67 8 8 0 11-13.84 8zM244.8 156.7a8 8 0 01-6.5-9.26A112.3 112.3 0 00240 128a8.23 8.23 0 018-8.26 7.81 7.81 0 018 8.76 124.89 124.89 0 01-1.92 21.72 8 8 0 01-9.26 6.48zM8 136.13a7.89 7.89 0 01-8-7.87s.61-15 1.86-22.18a8 8 0 1115.76 2.7A114.47 114.47 0 0016 128a8.09 8.09 0 01-8 8.13zm225.1-46.88a110.41 110.41 0 00-8.32-17.63 8 8 0 0113.83-8.08 129 129 0 019.52 20.17 8 8 0 01-15 5.54zM19.9 75.18A8 8 0 0117 64.26 126.41 126.41 0 0129.73 46 8 8 0 1142 56.21a112.72 112.72 0 00-11.17 16 8 8 0 01-10.93 3zm179.76-33.24a113.17 113.17 0 00-16-11.16 8 8 0 117.95-13.87 127.39 127.39 0 0118.3 12.75 8 8 0 01-10.24 12.28zM60.78 28.26a8 8 0 012.88-11 128 128 0 0120.18-9.44 8 8 0 115.52 15 112.17 112.17 0 00-17.63 8.31 8 8 0 01-11-2.88zm86.29-10.64A112.4 112.4 0 00128 16a8.17 8.17 0 01-8.19-8 7.84 7.84 0 017.81-8h.38a127.72 127.72 0 0121.8 1.86 8 8 0 01-2.71 15.76z"></path><path class="fill-primary" d="M128 32a96 96 0 1096 96 96.11 96.11 0 00-96-96zm62.61 145.66a103 103 0 00-14.49-7.76 160.22 160.22 0 005-33.9h26.48a79.47 79.47 0 01-17.01 41.66zM48.4 136h26.48a161.6 161.6 0 005 33.9 104.11 104.11 0 00-14.5 7.76A79.47 79.47 0 0148.4 136zm17-57.66a103.14 103.14 0 0014.5 7.76 160.2 160.2 0 00-5 33.9H48.4a79.47 79.47 0 0117-41.66zM120 79.7a106.49 106.49 0 01-20-3.43c5.41-13 12.6-22.11 20-26zm0 16V120H90.86A145.12 145.12 0 0195 91.49a122.72 122.72 0 0025 4.21zm0 40.3v24.3a121.26 121.26 0 00-25 4.23A144.37 144.37 0 0190.86 136H120zm0 40.3v29.48c-7.4-3.94-14.59-13-20-26a104.12 104.12 0 0120-3.44zm16 0a106.21 106.21 0 0120 3.43c-5.4 13-12.59 22.11-20 26zm0-16V136h29.1a144.37 144.37 0 01-4.16 28.51 122.49 122.49 0 00-25-4.21zm0-40.3V95.7a121.14 121.14 0 0025-4.23 142.91 142.91 0 014.1 28.53H136zm0-40.3V50.24c7.41 3.94 14.6 13 20 26a104.36 104.36 0 01-20 3.46zm27.94-23.08a80.19 80.19 0 0115.25 10 88.15 88.15 0 01-8.19 4.21 98.1 98.1 0 00-7.12-14.21zm-79 14.21a86.72 86.72 0 01-8.12-4.25 80.12 80.12 0 0115.24-10 95.14 95.14 0 00-7.12 14.25zm0 114.34a98.11 98.11 0 007.12 14.21 80.12 80.12 0 01-15.24-10 86.72 86.72 0 018.12-4.21zm86.1 0a88.15 88.15 0 018.13 4.25 80.19 80.19 0 01-15.25 10 99.14 99.14 0 007.08-14.25zM181.1 120a161 161 0 00-5-33.9 104.57 104.57 0 0014.49-7.76 79.47 79.47 0 0117 41.66z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">globe-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/globe-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/globe-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 244.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/headphone.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M35.72 92.28a92.28 92.28 0 01184.56 0v47.63a8.93 8.93 0 01-17.86 0V92.28a74.42 74.42 0 10-148.84 0v47.63a8.93 8.93 0 11-17.86 0zm175.63 62.51a8.93 8.93 0 018.93 8.93v35.72a32.75 32.75 0 01-32.75 32.75h-35.72a8.94 8.94 0 010-17.87h35.72a14.88 14.88 0 0014.89-14.88v-35.72a8.93 8.93 0 018.93-8.93z"></path><path class="fill-secondary" d="M107.16 223.26A20.84 20.84 0 01128 202.42h11.91a20.84 20.84 0 010 41.67H128a20.84 20.84 0 01-20.84-20.83zm20.84-3a3 3 0 100 5.95h11.91a3 3 0 000-5.95z"></path><path class="fill-primary" d="M32.74 107.16A32.74 32.74 0 000 139.91v23.81a32.75 32.75 0 0032.74 32.75h11.91a8.93 8.93 0 008.93-8.94v-71.44a8.93 8.93 0 00-8.93-8.93zm190.52 0A32.74 32.74 0 01256 139.91v23.81a32.75 32.75 0 01-32.74 32.75h-11.91a8.93 8.93 0 01-8.93-8.94v-71.44a8.93 8.93 0 018.93-8.93z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 244.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/headphone.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M35.72 92.28a92.28 92.28 0 01184.56 0v47.63a8.93 8.93 0 01-17.86 0V92.28a74.42 74.42 0 10-148.84 0v47.63a8.93 8.93 0 11-17.86 0zm175.63 62.51a8.93 8.93 0 018.93 8.93v35.72a32.75 32.75 0 01-32.75 32.75h-35.72a8.94 8.94 0 010-17.87h35.72a14.88 14.88 0 0014.89-14.88v-35.72a8.93 8.93 0 018.93-8.93z"></path><path class="fill-secondary" d="M107.16 223.26A20.84 20.84 0 01128 202.42h11.91a20.84 20.84 0 010 41.67H128a20.84 20.84 0 01-20.84-20.83zm20.84-3a3 3 0 100 5.95h11.91a3 3 0 000-5.95z"></path><path class="fill-primary" d="M32.74 107.16A32.74 32.74 0 000 139.91v23.81a32.75 32.75 0 0032.74 32.75h11.91a8.93 8.93 0 008.93-8.94v-71.44a8.93 8.93 0 00-8.93-8.93zm190.52 0A32.74 32.74 0 01256 139.91v23.81a32.75 32.75 0 01-32.74 32.75h-11.91a8.93 8.93 0 01-8.93-8.94v-71.44a8.93 8.93 0 018.93-8.93z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">headphone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/headphone.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/headphone.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 213.34 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/health-insurance.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M106.67 256a11 11 0 01-2.8-.37C102.83 255.35 0 226.26 0 127.21v-80a10.66 10.66 0 016.88-10l96-36.51a10.65 10.65 0 017.58 0l96 36.52a10.65 10.65 0 016.88 10v80c0 99.05-102.83 128.14-103.87 128.43a11 11 0 01-2.8.37zM21.34 54.55v72.66c0 75.17 70 102 85.33 107 15.31-5 85.33-31.82 85.33-107V54.55l-85.33-32.46z"></path><path class="fill-secondary" d="M109.34 192H104a18.7 18.7 0 01-18.68-18.67v-24h-24a18.7 18.7 0 01-18.67-18.68v-5.32a18.7 18.7 0 0118.67-18.68h24v-24A18.7 18.7 0 01104 64h5.32A18.7 18.7 0 01128 82.66v24h24a18.7 18.7 0 0118.67 18.68v5.32A18.7 18.7 0 01152 149.34h-24v24A18.71 18.71 0 01109.34 192z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 213.34 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/health-insurance.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M106.67 256a11 11 0 01-2.8-.37C102.83 255.35 0 226.26 0 127.21v-80a10.66 10.66 0 016.88-10l96-36.51a10.65 10.65 0 017.58 0l96 36.52a10.65 10.65 0 016.88 10v80c0 99.05-102.83 128.14-103.87 128.43a11 11 0 01-2.8.37zM21.34 54.55v72.66c0 75.17 70 102 85.33 107 15.31-5 85.33-31.82 85.33-107V54.55l-85.33-32.46z"></path><path class="fill-secondary" d="M109.34 192H104a18.7 18.7 0 01-18.68-18.67v-24h-24a18.7 18.7 0 01-18.67-18.68v-5.32a18.7 18.7 0 0118.67-18.68h24v-24A18.7 18.7 0 01104 64h5.32A18.7 18.7 0 01128 82.66v24h24a18.7 18.7 0 0118.67 18.68v5.32A18.7 18.7 0 01152 149.34h-24v24A18.71 18.71 0 01109.34 192z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">health-insurance</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/health-insurance.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/health-insurance.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 192" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/image.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M53.33 85.33A21.33 21.33 0 1032 64a21.36 21.36 0 0021.33 21.33z"></path><path class="fill-primary" d="M224 21.33H111.09L92.88 3.12A10.67 10.67 0 0085.34 0H32A32 32 0 000 32v128a32 32 0 0032 32h192a32 32 0 0032-32V53.33a32 32 0 00-32-32zm-192 0h48.93l18.21 18.21a10.67 10.67 0 007.53 3.12H224a10.67 10.67 0 0110.67 10.67v74l-56.11-56.1a18.74 18.74 0 00-26.46 0L101.33 122l-13.44-13.44a18.73 18.73 0 00-26.47 0l-40.11 40.11V32A10.7 10.7 0 0132 21.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 192" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/image.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M53.33 85.33A21.33 21.33 0 1032 64a21.36 21.36 0 0021.33 21.33z"></path><path class="fill-primary" d="M224 21.33H111.09L92.88 3.12A10.67 10.67 0 0085.34 0H32A32 32 0 000 32v128a32 32 0 0032 32h192a32 32 0 0032-32V53.33a32 32 0 00-32-32zm-192 0h48.93l18.21 18.21a10.67 10.67 0 007.53 3.12H224a10.67 10.67 0 0110.67 10.67v74l-56.11-56.1a18.74 18.74 0 00-26.46 0L101.33 122l-13.44-13.44a18.73 18.73 0 00-26.47 0l-40.11 40.11V32A10.7 10.7 0 0132 21.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">image</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/image.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/image.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/images.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M66.66 186.66a40 40 0 01-37.8-27.22l-.36-1.23a39.09 39.09 0 01-1.86-11.57V73.92L.78 160.32a24.24 24.24 0 0017 29.39l164.92 44.18a24.08 24.08 0 006.13.78 23.73 23.73 0 0023-17.44l9.6-30.56H66.66zM96 74.66a21.33 21.33 0 10-21.34-21.33A21.36 21.36 0 0096 74.66z"></path><path class="fill-primary" d="M229.31 0h-160a26.71 26.71 0 00-26.67 26.67V144a26.71 26.71 0 0026.67 26.67h160A26.7 26.7 0 00256 144V26.67A26.69 26.69 0 00229.31 0zm-160 21.33h160a5.32 5.32 0 015.33 5.33v75.72l-33.7-39.31a19.1 19.1 0 00-14.3-6.56 18.63 18.63 0 00-14.26 6.74l-39.6 47.55-12.89-12.9a18.75 18.75 0 00-26.47 0L64 127.34V26.66a5.33 5.33 0 015.33-5.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/images.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M66.66 186.66a40 40 0 01-37.8-27.22l-.36-1.23a39.09 39.09 0 01-1.86-11.57V73.92L.78 160.32a24.24 24.24 0 0017 29.39l164.92 44.18a24.08 24.08 0 006.13.78 23.73 23.73 0 0023-17.44l9.6-30.56H66.66zM96 74.66a21.33 21.33 0 10-21.34-21.33A21.36 21.36 0 0096 74.66z"></path><path class="fill-primary" d="M229.31 0h-160a26.71 26.71 0 00-26.67 26.67V144a26.71 26.71 0 0026.67 26.67h160A26.7 26.7 0 00256 144V26.67A26.69 26.69 0 00229.31 0zm-160 21.33h160a5.32 5.32 0 015.33 5.33v75.72l-33.7-39.31a19.1 19.1 0 00-14.3-6.56 18.63 18.63 0 00-14.26 6.74l-39.6 47.55-12.89-12.9a18.75 18.75 0 00-26.47 0L64 127.34V26.66a5.33 5.33 0 015.33-5.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">images</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/images.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/images.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 244.7 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/infographic.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M171.94 80h-99.2l33-69.44a18.39 18.39 0 0133.28 0z"></path><path class="fill-secondary" d="M217.38 176H27.3l37.87-80h114.34zm24.43 71.36a18.22 18.22 0 01-15.58 8.64H18.45a18.16 18.16 0 01-15.56-8.64 18.13 18.13 0 01-1.08-17.71L19.62 192h205.44l17.81 37.65a18.07 18.07 0 01-1.06 17.71z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 244.7 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/infographic.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M171.94 80h-99.2l33-69.44a18.39 18.39 0 0133.28 0z"></path><path class="fill-secondary" d="M217.38 176H27.3l37.87-80h114.34zm24.43 71.36a18.22 18.22 0 01-15.58 8.64H18.45a18.16 18.16 0 01-15.56-8.64 18.13 18.13 0 01-1.08-17.71L19.62 192h205.44l17.81 37.65a18.07 18.07 0 01-1.06 17.71z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">infographic</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/infographic.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/infographic.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/lamp.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M128 36.86a8 8 0 01-8-8V8a8 8 0 0116 0v20.86a8 8 0 01-8 8zm70.1 29.04a8 8 0 01-5.67-13.64l14.77-14.77a8 8 0 1111.31 11.31l-14.77 14.77a8 8 0 01-5.64 2.33zM248 136h-20.86a8 8 0 010-16H248a8 8 0 010 16zm-35.15 84.85a8.06 8.06 0 01-5.67-2.34l-14.76-14.77a8 8 0 0111.31-11.31l14.77 14.77a8 8 0 010 11.31 7.92 7.92 0 01-5.65 2.34zm-169.7 0a8 8 0 01-5.66-13.65l14.77-14.77a8 8 0 0111.31 11.31L48.8 218.51a7.93 7.93 0 01-5.65 2.34zM28.86 136H8a8 8 0 010-16h20.86a8 8 0 110 16zM57.9 65.9a8 8 0 01-5.66-2.33L37.47 48.8a8 8 0 1111.31-11.31l14.77 14.77A8 8 0 0157.9 65.9z"></path><path class="fill-primary" d="M160 224v13.33A18.76 18.76 0 01141.33 256h-26.67c-9 0-18.66-6.83-18.66-21.76V224zm15-154a74.93 74.93 0 00-63-15c-28.27 5.91-51.2 29-57.07 57.21a74.74 74.74 0 0028.16 75.41A32.19 32.19 0 0195.25 208v.12A2 2 0 0196 208h64a.93.93 0 01.53.11V208c1.49-8.11 6.29-15.57 13.65-21.33A74.72 74.72 0 00175 70zm-7 63.36a8.06 8.06 0 01-8-8A29.32 29.32 0 00130.67 96a8 8 0 110-16A45.43 45.43 0 01176 125.33a8.06 8.06 0 01-8 8z"></path><path class="fill-secondary" d="M95.25 208H96a1.8 1.8 0 00-.75.11z"></path><path class="fill-primary" d="M160.53 208v.11a.93.93 0 00-.53-.11z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/lamp.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M128 36.86a8 8 0 01-8-8V8a8 8 0 0116 0v20.86a8 8 0 01-8 8zm70.1 29.04a8 8 0 01-5.67-13.64l14.77-14.77a8 8 0 1111.31 11.31l-14.77 14.77a8 8 0 01-5.64 2.33zM248 136h-20.86a8 8 0 010-16H248a8 8 0 010 16zm-35.15 84.85a8.06 8.06 0 01-5.67-2.34l-14.76-14.77a8 8 0 0111.31-11.31l14.77 14.77a8 8 0 010 11.31 7.92 7.92 0 01-5.65 2.34zm-169.7 0a8 8 0 01-5.66-13.65l14.77-14.77a8 8 0 0111.31 11.31L48.8 218.51a7.93 7.93 0 01-5.65 2.34zM28.86 136H8a8 8 0 010-16h20.86a8 8 0 110 16zM57.9 65.9a8 8 0 01-5.66-2.33L37.47 48.8a8 8 0 1111.31-11.31l14.77 14.77A8 8 0 0157.9 65.9z"></path><path class="fill-primary" d="M160 224v13.33A18.76 18.76 0 01141.33 256h-26.67c-9 0-18.66-6.83-18.66-21.76V224zm15-154a74.93 74.93 0 00-63-15c-28.27 5.91-51.2 29-57.07 57.21a74.74 74.74 0 0028.16 75.41A32.19 32.19 0 0195.25 208v.12A2 2 0 0196 208h64a.93.93 0 01.53.11V208c1.49-8.11 6.29-15.57 13.65-21.33A74.72 74.72 0 00175 70zm-7 63.36a8.06 8.06 0 01-8-8A29.32 29.32 0 00130.67 96a8 8 0 110-16A45.43 45.43 0 01176 125.33a8.06 8.06 0 01-8 8z"></path><path class="fill-secondary" d="M95.25 208H96a1.8 1.8 0 00-.75.11z"></path><path class="fill-primary" d="M160.53 208v.11a.93.93 0 00-.53-.11z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">lamp</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/lamp.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/lamp.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.36" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layers.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M128 117.36a7.92 7.92 0 01-3.1-.63L4.9 66.06a8 8 0 010-14.75L124.9.64a7.9 7.9 0 016.22 0l120 50.67a8 8 0 010 14.75l-120 50.67a7.92 7.92 0 01-3.12.63zm123.1 19.29l-12.49-5.28-101.28 42.75a24 24 0 01-18.69 0L17.39 131.36l-12.51 5.28a8 8 0 000 14.75l120 50.67a8.06 8.06 0 006.2 0l120-50.67a8 8 0 000-14.74z"></path><path class="fill-secondary" d="M251.1 94l-12.49-5.3-101.28 42.75a24 24 0 01-18.69 0L17.39 88.68 4.88 94a8 8 0 000 14.77l120 50.67a7.94 7.94 0 006.2 0l120-50.67a8 8 0 000-14.75zm0 85.31L238.61 174l-101.28 42.78a23.66 23.66 0 01-9.33 1.9 23.91 23.91 0 01-9.36-1.9L17.39 174l-12.51 5.31a8 8 0 000 14.75l120 50.67a7.94 7.94 0 006.2 0l120-50.67a8 8 0 000-14.75z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 245.36" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layers.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M128 117.36a7.92 7.92 0 01-3.1-.63L4.9 66.06a8 8 0 010-14.75L124.9.64a7.9 7.9 0 016.22 0l120 50.67a8 8 0 010 14.75l-120 50.67a7.92 7.92 0 01-3.12.63zm123.1 19.29l-12.49-5.28-101.28 42.75a24 24 0 01-18.69 0L17.39 131.36l-12.51 5.28a8 8 0 000 14.75l120 50.67a8.06 8.06 0 006.2 0l120-50.67a8 8 0 000-14.74z"></path><path class="fill-secondary" d="M251.1 94l-12.49-5.3-101.28 42.75a24 24 0 01-18.69 0L17.39 88.68 4.88 94a8 8 0 000 14.77l120 50.67a7.94 7.94 0 006.2 0l120-50.67a8 8 0 000-14.75zm0 85.31L238.61 174l-101.28 42.78a23.66 23.66 0 01-9.33 1.9 23.91 23.91 0 01-9.36-1.9L17.39 174l-12.51 5.31a8 8 0 000 14.75l120 50.67a7.94 7.94 0 006.2 0l120-50.67a8 8 0 000-14.75z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">layers</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layers.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layers.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layout-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M0 102.4v141.87A11.73 11.73 0 0011.73 256h51.2a11.73 11.73 0 0011.73-11.73V102.4a11.73 11.73 0 00-11.73-11.73h-51.2A11.73 11.73 0 000 102.4z"></path><path class="fill-primary" d="M244.27 0H11.73A11.73 11.73 0 000 11.73v51.2a11.73 11.73 0 0011.73 11.73h232.53A11.72 11.72 0 00256 62.93v-51.2A11.7 11.7 0 00244.27 0zM102.4 256h141.87A11.73 11.73 0 00256 244.27V102.4a11.73 11.73 0 00-11.73-11.73H102.4a11.73 11.73 0 00-11.73 11.73v141.87A11.73 11.73 0 00102.4 256z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layout-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M0 102.4v141.87A11.73 11.73 0 0011.73 256h51.2a11.73 11.73 0 0011.73-11.73V102.4a11.73 11.73 0 00-11.73-11.73h-51.2A11.73 11.73 0 000 102.4z"></path><path class="fill-primary" d="M244.27 0H11.73A11.73 11.73 0 000 11.73v51.2a11.73 11.73 0 0011.73 11.73h232.53A11.72 11.72 0 00256 62.93v-51.2A11.7 11.7 0 00244.27 0zM102.4 256h141.87A11.73 11.73 0 00256 244.27V102.4a11.73 11.73 0 00-11.73-11.73H102.4a11.73 11.73 0 00-11.73 11.73v141.87A11.73 11.73 0 00102.4 256z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">layout-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layout-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layout-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layout-3.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M11.73 256h40.53A11.73 11.73 0 0064 244.27v-40.53A11.73 11.73 0 0052.27 192H11.73A11.73 11.73 0 000 203.73v40.53A11.73 11.73 0 0011.73 256z"></path><path class="fill-primary" d="M96 244.27A11.73 11.73 0 00107.73 256h40.53A11.73 11.73 0 00160 244.27v-40.53A11.73 11.73 0 00148.27 192h-40.53A11.73 11.73 0 0096 203.73z"></path><path class="fill-secondary" d="M244.27 192h-40.53A11.73 11.73 0 00192 203.73v40.53A11.73 11.73 0 00203.73 256h40.53A11.73 11.73 0 00256 244.27v-40.53A11.73 11.73 0 00244.27 192z"></path><path class="fill-primary" d="M11.73 160h40.53A11.73 11.73 0 0064 148.27v-40.53A11.73 11.73 0 0052.27 96H11.73A11.73 11.73 0 000 107.73v40.53A11.73 11.73 0 0011.73 160z"></path><path class="fill-secondary" d="M107.73 160h40.53A11.73 11.73 0 00160 148.27v-40.53A11.73 11.73 0 00148.27 96h-40.53A11.73 11.73 0 0096 107.73v40.53A11.73 11.73 0 00107.73 160z"></path><path class="fill-primary" d="M244.27 96h-40.53A11.73 11.73 0 00192 107.73v40.53A11.73 11.73 0 00203.73 160h40.53A11.73 11.73 0 00256 148.27v-40.53A11.73 11.73 0 00244.27 96zm0-96H11.73A11.73 11.73 0 000 11.73v40.53A11.73 11.73 0 0011.73 64h232.53A11.73 11.73 0 00256 52.27V11.73A11.73 11.73 0 00244.27 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layout-3.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M11.73 256h40.53A11.73 11.73 0 0064 244.27v-40.53A11.73 11.73 0 0052.27 192H11.73A11.73 11.73 0 000 203.73v40.53A11.73 11.73 0 0011.73 256z"></path><path class="fill-primary" d="M96 244.27A11.73 11.73 0 00107.73 256h40.53A11.73 11.73 0 00160 244.27v-40.53A11.73 11.73 0 00148.27 192h-40.53A11.73 11.73 0 0096 203.73z"></path><path class="fill-secondary" d="M244.27 192h-40.53A11.73 11.73 0 00192 203.73v40.53A11.73 11.73 0 00203.73 256h40.53A11.73 11.73 0 00256 244.27v-40.53A11.73 11.73 0 00244.27 192z"></path><path class="fill-primary" d="M11.73 160h40.53A11.73 11.73 0 0064 148.27v-40.53A11.73 11.73 0 0052.27 96H11.73A11.73 11.73 0 000 107.73v40.53A11.73 11.73 0 0011.73 160z"></path><path class="fill-secondary" d="M107.73 160h40.53A11.73 11.73 0 00160 148.27v-40.53A11.73 11.73 0 00148.27 96h-40.53A11.73 11.73 0 0096 107.73v40.53A11.73 11.73 0 00107.73 160z"></path><path class="fill-primary" d="M244.27 96h-40.53A11.73 11.73 0 00192 107.73v40.53A11.73 11.73 0 00203.73 160h40.53A11.73 11.73 0 00256 148.27v-40.53A11.73 11.73 0 00244.27 96zm0-96H11.73A11.73 11.73 0 000 11.73v40.53A11.73 11.73 0 0011.73 64h232.53A11.73 11.73 0 00256 52.27V11.73A11.73 11.73 0 00244.27 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">layout-3</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layout-3.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layout-3.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layout.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M244.27 0H150.4a11.73 11.73 0 00-11.73 11.73v147.2a11.73 11.73 0 0011.73 11.73h93.87A11.73 11.73 0 00256 158.93V11.73A11.73 11.73 0 00244.27 0z"></path><path class="fill-secondary" d="M11.73 170.67h93.87a11.73 11.73 0 0011.73-11.73V11.74A11.73 11.73 0 00105.6 0H11.73A11.73 11.73 0 000 11.73v147.2a11.74 11.74 0 0011.73 11.74z"></path><path class="fill-primary" d="M244.27 192H11.73A11.73 11.73 0 000 203.73v40.53A11.73 11.73 0 0011.73 256h232.53A11.73 11.73 0 00256 244.27v-40.53A11.73 11.73 0 00244.27 192z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/layout.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M244.27 0H150.4a11.73 11.73 0 00-11.73 11.73v147.2a11.73 11.73 0 0011.73 11.73h93.87A11.73 11.73 0 00256 158.93V11.73A11.73 11.73 0 00244.27 0z"></path><path class="fill-secondary" d="M11.73 170.67h93.87a11.73 11.73 0 0011.73-11.73V11.74A11.73 11.73 0 00105.6 0H11.73A11.73 11.73 0 000 11.73v147.2a11.74 11.74 0 0011.73 11.74z"></path><path class="fill-primary" d="M244.27 192H11.73A11.73 11.73 0 000 203.73v40.53A11.73 11.73 0 0011.73 256h232.53A11.73 11.73 0 00256 244.27v-40.53A11.73 11.73 0 00244.27 192z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">layout</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layout.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/layout.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/like.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M226.67 21.33a8 8 0 018 8v144a8 8 0 01-8 8H107.31a21.3 21.3 0 00-15.09 6.25L64 215.81v-13.14a21.34 21.34 0 00-21.33-21.33H29.33a8 8 0 01-8-8v-144a8 8 0 018-8h197.34zm0-21.33H29.33A29.35 29.35 0 000 29.33v144a29.36 29.36 0 0029.33 29.33h13.33V248a8 8 0 004.94 7.39 7.82 7.82 0 003.07.61 8.09 8.09 0 005.67-2.34l51-51h119.35A29.36 29.36 0 00256 173.34v-144A29.39 29.39 0 00226.67 0z"></path><path class="fill-secondary" d="M96 146.67a10.67 10.67 0 01-10.67 10.67H74.66A10.68 10.68 0 0164 146.67v-64A10.67 10.67 0 0174.66 72h10.67A10.67 10.67 0 0196 82.67zm89.92-10.88C184 148.06 172.8 157.34 160 157.34h-8.11c-21.33 0-36.16-4-45.44-7.79a25.36 25.36 0 00.21-2.88v-64A21.24 21.24 0 00104 72.32c5.65-4.48 12.69-11.73 12.69-19.84 0-6.61 0-20.27 12.8-20.27 8.53 0 17.81 7.89 17.81 25.17A48.86 48.86 0 01145 72h21.23A25.76 25.76 0 01192 97.71c0 .32-1.28 27.09-6.51 38z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/like.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M226.67 21.33a8 8 0 018 8v144a8 8 0 01-8 8H107.31a21.3 21.3 0 00-15.09 6.25L64 215.81v-13.14a21.34 21.34 0 00-21.33-21.33H29.33a8 8 0 01-8-8v-144a8 8 0 018-8h197.34zm0-21.33H29.33A29.35 29.35 0 000 29.33v144a29.36 29.36 0 0029.33 29.33h13.33V248a8 8 0 004.94 7.39 7.82 7.82 0 003.07.61 8.09 8.09 0 005.67-2.34l51-51h119.35A29.36 29.36 0 00256 173.34v-144A29.39 29.39 0 00226.67 0z"></path><path class="fill-secondary" d="M96 146.67a10.67 10.67 0 01-10.67 10.67H74.66A10.68 10.68 0 0164 146.67v-64A10.67 10.67 0 0174.66 72h10.67A10.67 10.67 0 0196 82.67zm89.92-10.88C184 148.06 172.8 157.34 160 157.34h-8.11c-21.33 0-36.16-4-45.44-7.79a25.36 25.36 0 00.21-2.88v-64A21.24 21.24 0 00104 72.32c5.65-4.48 12.69-11.73 12.69-19.84 0-6.61 0-20.27 12.8-20.27 8.53 0 17.81 7.89 17.81 25.17A48.86 48.86 0 01145 72h21.23A25.76 25.76 0 01192 97.71c0 .32-1.28 27.09-6.51 38z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">like</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/like.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/like.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.67 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/link.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M177.25 156.4a10.67 10.67 0 01-7.54-18.21l28.43-28.43a51 51 0 0015.2-36.61 51.88 51.88 0 00-51.82-51.81A51.09 51.09 0 00125 36.51L96.48 65a10.67 10.67 0 01-15.09-15.11l28.43-28.43A72.25 72.25 0 01161.52 0a73.23 73.23 0 0173.15 73.15 72.24 72.24 0 01-21.49 51.73l-28.38 28.39a10.67 10.67 0 01-7.55 3.13zM73.14 234.67A73.22 73.22 0 010 161.52a72.28 72.28 0 0121.47-51.71l28.4-28.4A10.67 10.67 0 0165 96.5l-28.47 28.43a51.15 51.15 0 00-15.2 36.61 51.86 51.86 0 0051.81 51.8 51.14 51.14 0 0036.57-15.16l28.47-28.47a10.67 10.67 0 1115.09 15.09l-28.44 28.43a72.22 72.22 0 01-51.69 21.44z"></path><path class="fill-secondary" d="M74.67 170.67a10.67 10.67 0 01-7.53-18.21l85.32-85.32a10.67 10.67 0 0115.09 15.08l-85.33 85.33a10.69 10.69 0 01-7.55 3.12z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.67 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/link.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M177.25 156.4a10.67 10.67 0 01-7.54-18.21l28.43-28.43a51 51 0 0015.2-36.61 51.88 51.88 0 00-51.82-51.81A51.09 51.09 0 00125 36.51L96.48 65a10.67 10.67 0 01-15.09-15.11l28.43-28.43A72.25 72.25 0 01161.52 0a73.23 73.23 0 0173.15 73.15 72.24 72.24 0 01-21.49 51.73l-28.38 28.39a10.67 10.67 0 01-7.55 3.13zM73.14 234.67A73.22 73.22 0 010 161.52a72.28 72.28 0 0121.47-51.71l28.4-28.4A10.67 10.67 0 0165 96.5l-28.47 28.43a51.15 51.15 0 00-15.2 36.61 51.86 51.86 0 0051.81 51.8 51.14 51.14 0 0036.57-15.16l28.47-28.47a10.67 10.67 0 1115.09 15.09l-28.44 28.43a72.22 72.22 0 01-51.69 21.44z"></path><path class="fill-secondary" d="M74.67 170.67a10.67 10.67 0 01-7.53-18.21l85.32-85.32a10.67 10.67 0 0115.09 15.08l-85.33 85.33a10.69 10.69 0 01-7.55 3.12z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">link</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/link.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/link.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/list.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M160 0H32A32 32 0 000 32v160a10.66 10.66 0 003.12 7.54l53.33 53.32A10.63 10.63 0 0064 256h96a32 32 0 0032-32V32a32 32 0 00-32-32zm10.67 224A10.67 10.67 0 01160 234.67H74.67v-24a29.36 29.36 0 00-29.33-29.33h-24V32A10.68 10.68 0 0132 21.33h128A10.68 10.68 0 01170.69 32v192z"></path><path class="fill-secondary" d="M130.67 85.33H61.34a18.7 18.7 0 01-18.67-18.67v-5.33a18.69 18.69 0 0118.67-18.67h69.33a18.68 18.68 0 0118.67 18.67v5.33a18.7 18.7 0 01-18.67 18.67zm8 42.67H53.34a10.67 10.67 0 110-21.34h85.33a10.67 10.67 0 110 21.34zm0 42.67H53.34a10.67 10.67 0 010-21.34h85.33a10.67 10.67 0 110 21.34z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/list.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M160 0H32A32 32 0 000 32v160a10.66 10.66 0 003.12 7.54l53.33 53.32A10.63 10.63 0 0064 256h96a32 32 0 0032-32V32a32 32 0 00-32-32zm10.67 224A10.67 10.67 0 01160 234.67H74.67v-24a29.36 29.36 0 00-29.33-29.33h-24V32A10.68 10.68 0 0132 21.33h128A10.68 10.68 0 01170.69 32v192z"></path><path class="fill-secondary" d="M130.67 85.33H61.34a18.7 18.7 0 01-18.67-18.67v-5.33a18.69 18.69 0 0118.67-18.67h69.33a18.68 18.68 0 0118.67 18.67v5.33a18.7 18.7 0 01-18.67 18.67zm8 42.67H53.34a10.67 10.67 0 110-21.34h85.33a10.67 10.67 0 110 21.34zm0 42.67H53.34a10.67 10.67 0 010-21.34h85.33a10.67 10.67 0 110 21.34z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">list</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/list.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/list.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/lock.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M168 96H24a24 24 0 00-24 24v112a24 24 0 0024 24h144a24 24 0 0024-24V120a24 24 0 00-24-24z"></path><path class="fill-secondary" d="M160 64v32h-21.33V64a42.67 42.67 0 10-85.34 0v32H32V64a64 64 0 01128 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 192 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/lock.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M168 96H24a24 24 0 00-24 24v112a24 24 0 0024 24h144a24 24 0 0024-24V120a24 24 0 00-24-24z"></path><path class="fill-secondary" d="M160 64v32h-21.33V64a42.67 42.67 0 10-85.34 0v32H32V64a64 64 0 01128 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">lock</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/lock.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/lock.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.96 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/love.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M96 186.67A90.77 90.77 0 01186.63 96a89.82 89.82 0 0138.9 8.9 64.28 64.28 0 00-95.3-86L120 29.15l-10.28-10.27a64.21 64.21 0 00-90.93 0 64.56 64.56 0 000 91.06L96 187.28z"></path><path class="fill-secondary" d="M186.63 117.33A69.34 69.34 0 10256 186.67a69.41 69.41 0 00-69.37-69.34zm30.19 55.73l-30.54 37.32a8.06 8.06 0 01-5.92 3h-.27a8 8 0 01-5.84-2.53l-17.46-18.67a8 8 0 0111.7-10.95l11.21 12 24.76-30.26a8 8 0 1112.36 10.15z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.96 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/love.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M96 186.67A90.77 90.77 0 01186.63 96a89.82 89.82 0 0138.9 8.9 64.28 64.28 0 00-95.3-86L120 29.15l-10.28-10.27a64.21 64.21 0 00-90.93 0 64.56 64.56 0 000 91.06L96 187.28z"></path><path class="fill-secondary" d="M186.63 117.33A69.34 69.34 0 10256 186.67a69.41 69.41 0 00-69.37-69.34zm30.19 55.73l-30.54 37.32a8.06 8.06 0 01-5.92 3h-.27a8 8 0 01-5.84-2.53l-17.46-18.67a8 8 0 0111.7-10.95l11.21 12 24.76-30.26a8 8 0 1112.36 10.15z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">love</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/love.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/love.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/marker.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M40.46 231.55l-16-16a10.62 10.62 0 01-2.64-10.7L43.14 136a10.66 10.66 0 0120.37 6.32L44.09 205l6.91 6.94 63.2-19.44a10.66 10.66 0 116.27 20.38l-69.33 21.33a10.68 10.68 0 01-10.68-2.66z"></path><path class="fill-primary" d="M37.32 245.34H8a8 8 0 01-6.46-12.7l21.33-29.33a7.92 7.92 0 015.84-3.26 8.1 8.1 0 016.29 2.32L53.66 221a8 8 0 010 11.31L43 243a8.06 8.06 0 01-5.68 2.34z"></path><path class="fill-secondary" d="M236.58 104.18l2-2.07a59.93 59.93 0 00-84.75-84.75l-2.06 2.05z"></path><path class="fill-primary" d="M136.66 34.42l-88.57 87.76a18.38 18.38 0 000 26.06L107.78 208a18.41 18.41 0 0026.07-.08l87.73-88.55z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/marker.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M40.46 231.55l-16-16a10.62 10.62 0 01-2.64-10.7L43.14 136a10.66 10.66 0 0120.37 6.32L44.09 205l6.91 6.94 63.2-19.44a10.66 10.66 0 116.27 20.38l-69.33 21.33a10.68 10.68 0 01-10.68-2.66z"></path><path class="fill-primary" d="M37.32 245.34H8a8 8 0 01-6.46-12.7l21.33-29.33a7.92 7.92 0 015.84-3.26 8.1 8.1 0 016.29 2.32L53.66 221a8 8 0 010 11.31L43 243a8.06 8.06 0 01-5.68 2.34z"></path><path class="fill-secondary" d="M236.58 104.18l2-2.07a59.93 59.93 0 00-84.75-84.75l-2.06 2.05z"></path><path class="fill-primary" d="M136.66 34.42l-88.57 87.76a18.38 18.38 0 000 26.06L107.78 208a18.41 18.41 0 0026.07-.08l87.73-88.55z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">marker</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/marker.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/marker.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.91" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/mask.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M244.27 93.45c-22.19-11-43-17.17-62.93-18.56v9.28a109.1 109.1 0 01-.64 12c17 1.28 34.68 6.72 54 16.11V159c0 35.52-24.53 66.77-58.67 75.2a77.27 77.27 0 01-53.23-46.93 113.48 113.48 0 01-19.09 9.39 98.38 98.38 0 0070.08 59 15.41 15.41 0 002.24.2 18.82 18.82 0 002.24-.2c45-9.72 77.76-50.36 77.76-96.64v-46.67a21 21 0 00-11.76-18.9z"></path><path class="fill-secondary" d="M208 138.57c-8.45 0-15-5.06-15.94-12.3a8 8 0 0115.46-3.73 4.82 4.82 0 00.93 0 8 8 0 0115.45 3.73c-.9 7.24-7.45 12.3-15.9 12.3z"></path><path class="fill-primary" d="M149.57 19.05C97.65-6.37 53.06-6.36 9.25 19.15A18.69 18.69 0 000 35.34v48.83a99.59 99.59 0 0078.32 96.88 7.93 7.93 0 003.36 0A99.57 99.57 0 00160 84.17V35.85a18.8 18.8 0 00-10.43-16.8zM32.06 54.87c.94-7.23 7.49-12.3 15.94-12.3s15 5.06 15.94 12.3a8 8 0 01-6.9 9 7.37 7.37 0 01-1 .07 8 8 0 01-7.52-5.31 3.62 3.62 0 00-.93 0 8 8 0 01-15.49-3.72zM115.23 120c-11.31 12.31-23.17 18.57-35.23 18.57S56.08 132.31 44.77 120a8 8 0 1111.79-10.8c16.32 17.79 30.56 17.79 46.88 0a8 8 0 1111.79 10.8zM121 63.83a7.37 7.37 0 01-1 .07 8 8 0 01-7.52-5.31 3.54 3.54 0 00-.92 0 8 8 0 01-15.46-3.73c.9-7.23 7.47-12.31 15.9-12.31s15 5.06 16 12.31a8 8 0 01-7 8.97z"></path><path class="fill-secondary" d="M199.44 200c-16.32-17.79-30.56-17.79-46.88 0a8 8 0 01-11.79-10.8c22.61-24.67 47.84-24.67 70.46 0a8 8 0 01-11.79 10.8z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.91" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/mask.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M244.27 93.45c-22.19-11-43-17.17-62.93-18.56v9.28a109.1 109.1 0 01-.64 12c17 1.28 34.68 6.72 54 16.11V159c0 35.52-24.53 66.77-58.67 75.2a77.27 77.27 0 01-53.23-46.93 113.48 113.48 0 01-19.09 9.39 98.38 98.38 0 0070.08 59 15.41 15.41 0 002.24.2 18.82 18.82 0 002.24-.2c45-9.72 77.76-50.36 77.76-96.64v-46.67a21 21 0 00-11.76-18.9z"></path><path class="fill-secondary" d="M208 138.57c-8.45 0-15-5.06-15.94-12.3a8 8 0 0115.46-3.73 4.82 4.82 0 00.93 0 8 8 0 0115.45 3.73c-.9 7.24-7.45 12.3-15.9 12.3z"></path><path class="fill-primary" d="M149.57 19.05C97.65-6.37 53.06-6.36 9.25 19.15A18.69 18.69 0 000 35.34v48.83a99.59 99.59 0 0078.32 96.88 7.93 7.93 0 003.36 0A99.57 99.57 0 00160 84.17V35.85a18.8 18.8 0 00-10.43-16.8zM32.06 54.87c.94-7.23 7.49-12.3 15.94-12.3s15 5.06 15.94 12.3a8 8 0 01-6.9 9 7.37 7.37 0 01-1 .07 8 8 0 01-7.52-5.31 3.62 3.62 0 00-.93 0 8 8 0 01-15.49-3.72zM115.23 120c-11.31 12.31-23.17 18.57-35.23 18.57S56.08 132.31 44.77 120a8 8 0 1111.79-10.8c16.32 17.79 30.56 17.79 46.88 0a8 8 0 1111.79 10.8zM121 63.83a7.37 7.37 0 01-1 .07 8 8 0 01-7.52-5.31 3.54 3.54 0 00-.92 0 8 8 0 01-15.46-3.73c.9-7.23 7.47-12.31 15.9-12.31s15 5.06 16 12.31a8 8 0 01-7 8.97z"></path><path class="fill-secondary" d="M199.44 200c-16.32-17.79-30.56-17.79-46.88 0a8 8 0 01-11.79-10.8c22.61-24.67 47.84-24.67 70.46 0a8 8 0 01-11.79 10.8z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">mask</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/mask.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/mask.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 152.88 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/medal.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M132.91 110.53l19-73.84A29.28 29.28 0 00123.6 0h-15.15v96.61a89.88 89.88 0 0124.46 13.92zM76.45 90.67a90.68 90.68 0 0116 1.51V0h-32v92.16a90.68 90.68 0 0116-1.49zM20 110.5a90.15 90.15 0 0124.45-13.89V0H29.3A29.25 29.25 0 001 36.66z"></path><path class="fill-secondary" d="M76.45 106.67a74.67 74.67 0 1074.67 74.66 74.75 74.75 0 00-74.67-74.66zm0 112a37.34 37.34 0 1137.33-37.34 37.38 37.38 0 01-37.33 37.34z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 152.88 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/medal.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M132.91 110.53l19-73.84A29.28 29.28 0 00123.6 0h-15.15v96.61a89.88 89.88 0 0124.46 13.92zM76.45 90.67a90.68 90.68 0 0116 1.51V0h-32v92.16a90.68 90.68 0 0116-1.49zM20 110.5a90.15 90.15 0 0124.45-13.89V0H29.3A29.25 29.25 0 001 36.66z"></path><path class="fill-secondary" d="M76.45 106.67a74.67 74.67 0 1074.67 74.66 74.75 74.75 0 00-74.67-74.66zm0 112a37.34 37.34 0 1137.33-37.34 37.38 37.38 0 01-37.33 37.34z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">medal</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/medal.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/medal.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/monitor.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M170.67 234.69h-21.33v-21.33h-42.67v21.33H85.34a10.67 10.67 0 000 21.33h85.33a10.67 10.67 0 100-21.33z"></path><path class="fill-primary" d="M237.33 42.69h-57.6a74.11 74.11 0 011.6 15.36v6h53.33V192H21.33V64h53.33v-6a73.43 73.43 0 011.6-15.36h-57.6A18.74 18.74 0 000 61.34v133.33a18.76 18.76 0 0018.67 18.67h218.67A18.77 18.77 0 00256 194.67V61.34a18.77 18.77 0 00-18.67-18.65z"></path><path class="fill-secondary" d="M176 138.58H80a5.33 5.33 0 01-5.33-5.33v-12.5a26.5 26.5 0 017.81-18.86L96 88.35V58a59 59 0 0112.16-35.77L123.76 2a5.52 5.52 0 018.46 0l15.6 20.29A59 59 0 01160 58v30.35l13.52 13.52a26.49 26.49 0 017.81 18.87v12.49a5.32 5.32 0 01-5.33 5.35z"></path><path class="fill-secondary" d="M154.67 159.9A10.67 10.67 0 01144 149.23v-16a10.67 10.67 0 0121.34 0v16a10.68 10.68 0 01-10.67 10.67zm-53.34 0a10.67 10.67 0 01-10.67-10.67v-16a10.67 10.67 0 0121.34 0v16a10.67 10.67 0 01-10.67 10.67z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/monitor.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M170.67 234.69h-21.33v-21.33h-42.67v21.33H85.34a10.67 10.67 0 000 21.33h85.33a10.67 10.67 0 100-21.33z"></path><path class="fill-primary" d="M237.33 42.69h-57.6a74.11 74.11 0 011.6 15.36v6h53.33V192H21.33V64h53.33v-6a73.43 73.43 0 011.6-15.36h-57.6A18.74 18.74 0 000 61.34v133.33a18.76 18.76 0 0018.67 18.67h218.67A18.77 18.77 0 00256 194.67V61.34a18.77 18.77 0 00-18.67-18.65z"></path><path class="fill-secondary" d="M176 138.58H80a5.33 5.33 0 01-5.33-5.33v-12.5a26.5 26.5 0 017.81-18.86L96 88.35V58a59 59 0 0112.16-35.77L123.76 2a5.52 5.52 0 018.46 0l15.6 20.29A59 59 0 01160 58v30.35l13.52 13.52a26.49 26.49 0 017.81 18.87v12.49a5.32 5.32 0 01-5.33 5.35z"></path><path class="fill-secondary" d="M154.67 159.9A10.67 10.67 0 01144 149.23v-16a10.67 10.67 0 0121.34 0v16a10.68 10.68 0 01-10.67 10.67zm-53.34 0a10.67 10.67 0 01-10.67-10.67v-16a10.67 10.67 0 0121.34 0v16a10.67 10.67 0 01-10.67 10.67z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">monitor</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/monitor.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/monitor.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 258.67 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/navigation.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M248 234.67H40a18.67 18.67 0 010-37.34h64a40 40 0 000-80H58.67a10.67 10.67 0 000 21.34H104a18.67 18.67 0 110 37.33H40a40 40 0 000 80h208c5.89 0 5.89-21.33 0-21.33z"></path><path class="fill-primary" d="M56 0C26.59 0 2.67 24.22 2.67 54c0 41.09 46.16 81.06 48.13 82.75a8 8 0 0010.4 0c2-1.68 48.13-41.65 48.13-82.75 0-29.78-23.92-54-53.33-54zm0 74.67a21.34 21.34 0 1121.33-21.34A21.36 21.36 0 0156 74.67zm181.33 170.66a10.67 10.67 0 0021.34 0v-42.67h-21.33v42.67zM170.66 192a8 8 0 01-6.47-12.7l17.91-24.63-17.91-24.62a8 8 0 016.47-12.71h88V192z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 258.67 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/navigation.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M248 234.67H40a18.67 18.67 0 010-37.34h64a40 40 0 000-80H58.67a10.67 10.67 0 000 21.34H104a18.67 18.67 0 110 37.33H40a40 40 0 000 80h208c5.89 0 5.89-21.33 0-21.33z"></path><path class="fill-primary" d="M56 0C26.59 0 2.67 24.22 2.67 54c0 41.09 46.16 81.06 48.13 82.75a8 8 0 0010.4 0c2-1.68 48.13-41.65 48.13-82.75 0-29.78-23.92-54-53.33-54zm0 74.67a21.34 21.34 0 1121.33-21.34A21.36 21.36 0 0156 74.67zm181.33 170.66a10.67 10.67 0 0021.34 0v-42.67h-21.33v42.67zM170.66 192a8 8 0 01-6.47-12.7l17.91-24.63-17.91-24.62a8 8 0 016.47-12.71h88V192z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">navigation</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/navigation.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/navigation.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/network.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M61.33 173v-25.3a21.33 21.33 0 10-16 0V176a8.14 8.14 0 001.92 5.22l30.08 35.08V248a8 8 0 0016 0v-34.67a8.12 8.12 0 00-1.92-5.22zM128 106.67a21.31 21.31 0 00-8 41.07V248a8 8 0 0016 0V147.74a21.31 21.31 0 00-8-41.07zM224 128a21.33 21.33 0 10-29.33 19.74V173l-30.08 35.09a8 8 0 00-1.92 5.21V248a8 8 0 0016 0v-31.71l30.08-35.09a8 8 0 001.92-5.22v-28.25A21.29 21.29 0 00224 128z"></path><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h24v-10.45l-9.28-10.88H32a10.7 10.7 0 01-10.67-10.67V53.34h213.34v149.33A10.7 10.7 0 01224 213.34h-14.72L200 224.22v10.45h24a32.09 32.09 0 0032-32V32a32.09 32.09 0 00-32-32z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/network.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M61.33 173v-25.3a21.33 21.33 0 10-16 0V176a8.14 8.14 0 001.92 5.22l30.08 35.08V248a8 8 0 0016 0v-34.67a8.12 8.12 0 00-1.92-5.22zM128 106.67a21.31 21.31 0 00-8 41.07V248a8 8 0 0016 0V147.74a21.31 21.31 0 00-8-41.07zM224 128a21.33 21.33 0 10-29.33 19.74V173l-30.08 35.09a8 8 0 00-1.92 5.21V248a8 8 0 0016 0v-31.71l30.08-35.09a8 8 0 001.92-5.22v-28.25A21.29 21.29 0 00224 128z"></path><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h24v-10.45l-9.28-10.88H32a10.7 10.7 0 01-10.67-10.67V53.34h213.34v149.33A10.7 10.7 0 01224 213.34h-14.72L200 224.22v10.45h24a32.09 32.09 0 0032-32V32a32.09 32.09 0 00-32-32z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">network</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/network.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/network.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 226.67 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/note.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M48 58.67H10.67a10.67 10.67 0 010-21.34H48a10.67 10.67 0 010 21.34zM48 112H10.67a10.67 10.67 0 110-21.34H48A10.67 10.67 0 0148 112zm0 53.33H10.67a10.67 10.67 0 110-21.33H48a10.67 10.67 0 010 21.33zm0 53.34H10.67a10.67 10.67 0 110-21.34H48a10.67 10.67 0 010 21.34z"></path><path class="fill-primary" d="M197.34 0h-144A29.35 29.35 0 0024 29.33v197.33A29.35 29.35 0 0053.34 256h144a29.35 29.35 0 0029.33-29.32V29.33A29.35 29.35 0 00197.34 0zM88 53.33h42.67a10.67 10.67 0 110 21.34H88a10.67 10.67 0 110-21.34zm96 149.34H88a10.67 10.67 0 110-21.34h96a10.67 10.67 0 110 21.34zm0-42.67H88a10.67 10.67 0 110-21.34h96a10.67 10.67 0 010 21.34zm0-42.67H88A10.67 10.67 0 1188 96h96a10.67 10.67 0 110 21.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 226.67 255.98" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/note.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M48 58.67H10.67a10.67 10.67 0 010-21.34H48a10.67 10.67 0 010 21.34zM48 112H10.67a10.67 10.67 0 110-21.34H48A10.67 10.67 0 0148 112zm0 53.33H10.67a10.67 10.67 0 110-21.33H48a10.67 10.67 0 010 21.33zm0 53.34H10.67a10.67 10.67 0 110-21.34H48a10.67 10.67 0 010 21.34z"></path><path class="fill-primary" d="M197.34 0h-144A29.35 29.35 0 0024 29.33v197.33A29.35 29.35 0 0053.34 256h144a29.35 29.35 0 0029.33-29.32V29.33A29.35 29.35 0 00197.34 0zM88 53.33h42.67a10.67 10.67 0 110 21.34H88a10.67 10.67 0 110-21.34zm96 149.34H88a10.67 10.67 0 110-21.34h96a10.67 10.67 0 110 21.34zm0-42.67H88a10.67 10.67 0 110-21.34h96a10.67 10.67 0 010 21.34zm0-42.67H88A10.67 10.67 0 1188 96h96a10.67 10.67 0 110 21.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">note</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/note.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/note.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 226.67 227.75" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/paint.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M215.33 206.4h-204C5.08 206.4 0 211.18 0 217.07s5.08 10.68 11.34 10.68h204c6.26 0 11.34-4.79 11.34-10.68s-5.09-10.67-11.35-10.67z"></path><path class="fill-primary" d="M89.92 195.71a31.26 31.26 0 0022.18-9.17L192.61 106a10.68 10.68 0 000-15.09L104.77 3.12a10.68 10.68 0 00-15.09 0L9.17 83.63a31.39 31.39 0 000 44.35l58.56 58.56a31.28 31.28 0 0022.19 9.17zm7.31-170L170 98.48l-1.24 1.23H23.6a8.42 8.42 0 01.67-1zm76.1 142.45c0 15.2 12 27.55 26.67 27.55s26.67-12.37 26.67-27.55c0-12.24-15.3-36.4-20-43.5-3-4.5-10.4-4.5-13.36 0-4.69 7.1-19.98 31.26-19.98 43.5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 226.67 227.75" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/paint.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M215.33 206.4h-204C5.08 206.4 0 211.18 0 217.07s5.08 10.68 11.34 10.68h204c6.26 0 11.34-4.79 11.34-10.68s-5.09-10.67-11.35-10.67z"></path><path class="fill-primary" d="M89.92 195.71a31.26 31.26 0 0022.18-9.17L192.61 106a10.68 10.68 0 000-15.09L104.77 3.12a10.68 10.68 0 00-15.09 0L9.17 83.63a31.39 31.39 0 000 44.35l58.56 58.56a31.28 31.28 0 0022.19 9.17zm7.31-170L170 98.48l-1.24 1.23H23.6a8.42 8.42 0 01.67-1zm76.1 142.45c0 15.2 12 27.55 26.67 27.55s26.67-12.37 26.67-27.55c0-12.24-15.3-36.4-20-43.5-3-4.5-10.4-4.5-13.36 0-4.69 7.1-19.98 31.26-19.98 43.5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">paint</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/paint.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/paint.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/paper-plane.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M93.32 187.87v49.47a8 8 0 0014.45 4.74l28.92-39.4z"></path><path class="fill-primary" d="M252.63 1.48a8 8 0 00-8.34-.57l-240 125.33a8 8 0 001.12 14.67l66.72 22.8L214.21 42.22 104.26 174.68l111.81 38.21a8 8 0 002.59.43 8 8 0 007.91-6.83L255.89 9.16a8 8 0 00-3.26-7.68z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/paper-plane.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M93.32 187.87v49.47a8 8 0 0014.45 4.74l28.92-39.4z"></path><path class="fill-primary" d="M252.63 1.48a8 8 0 00-8.34-.57l-240 125.33a8 8 0 001.12 14.67l66.72 22.8L214.21 42.22 104.26 174.68l111.81 38.21a8 8 0 002.59.43 8 8 0 007.91-6.83L255.89 9.16a8 8 0 00-3.26-7.68z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">paper-plane</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/paper-plane.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/paper-plane.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.72" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/partnership.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M5.25 106.72A5.34 5.34 0 000 112.05v98.64a2.68 2.68 0 002.67 2.67H28a5.33 5.33 0 005.13-3.87L56.7 126.3a10.66 10.66 0 00-6.6-12.92c-9.67-3.52-24.5-7-44.85-6.66zm229.42 58.64c-21.33 0-64 27-85.33 27S104 176 104 176s28.74 5.33 45.33 5.33 21.33-5.66 21.33-13.33c0-18.67-31.72-21.57-47.75-24-15.74-8.77-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.55c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33s-10.65-16-21.31-16z"></path><path class="fill-secondary" d="M250.75 128a5.34 5.34 0 005.25-5.33V24a2.68 2.68 0 00-2.67-2.67H228a5.33 5.33 0 00-5.13 3.87l-23.6 83.19a10.66 10.66 0 006.6 12.92c9.7 3.55 24.53 7.04 44.88 6.69zM21.33 69.36c21.33 0 64-27 85.33-27S152 58.69 152 58.69s-28.72-5.33-45.31-5.33S85.34 59 85.34 66.69c0 18.67 31.72 21.57 47.75 24 15.74 8.77 23.92 15.69 50 17.9a28.85 28.85 0 01.81-4.54l21.43-75.52C181.06 17.49 139.28 0 117.34 0 85.33 0 0 42.69 0 53.36s10.67 16 21.33 16z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.72" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/partnership.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M5.25 106.72A5.34 5.34 0 000 112.05v98.64a2.68 2.68 0 002.67 2.67H28a5.33 5.33 0 005.13-3.87L56.7 126.3a10.66 10.66 0 00-6.6-12.92c-9.67-3.52-24.5-7-44.85-6.66zm229.42 58.64c-21.33 0-64 27-85.33 27S104 176 104 176s28.74 5.33 45.33 5.33 21.33-5.66 21.33-13.33c0-18.67-31.72-21.57-47.75-24-15.74-8.77-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.55c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33s-10.65-16-21.31-16z"></path><path class="fill-secondary" d="M250.75 128a5.34 5.34 0 005.25-5.33V24a2.68 2.68 0 00-2.67-2.67H228a5.33 5.33 0 00-5.13 3.87l-23.6 83.19a10.66 10.66 0 006.6 12.92c9.7 3.55 24.53 7.04 44.88 6.69zM21.33 69.36c21.33 0 64-27 85.33-27S152 58.69 152 58.69s-28.72-5.33-45.31-5.33S85.34 59 85.34 66.69c0 18.67 31.72 21.57 47.75 24 15.74 8.77 23.92 15.69 50 17.9a28.85 28.85 0 01.81-4.54l21.43-75.52C181.06 17.49 139.28 0 117.34 0 85.33 0 0 42.69 0 53.36s10.67 16 21.33 16z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">partnership</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/partnership.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/partnership.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/pen-tool.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M162.62 162.53l17.14-27.87a10.65 10.65 0 00.8-9.6L137.89 20a10.68 10.68 0 00-19.78 0L75.44 125.06a10.71 10.71 0 00.8 9.6l17.14 27.87a18.56 18.56 0 00-9.2 13.68L74.74 247a7.94 7.94 0 007.93 9h90.67a8 8 0 007.92-9.07l-9.44-70.74a18.56 18.56 0 00-9.2-13.66zm-45.29-83.91v28.05a10.67 10.67 0 1021.34 0v-28l20.08 49.46L139.14 160h-22.29l-19.62-31.92z"></path><path class="fill-secondary" d="M248 0h-26.67a8 8 0 00-8 8v2.67H42.66V8a8 8 0 00-8-8H8a8 8 0 00-8 8v26.67a8 8 0 008 8h26.67a8 8 0 008-8V32h19.84a111.78 111.78 0 00-46.38 88.24 21.32 21.32 0 1021.33.13 90.58 90.58 0 01181.1 0 21.33 21.33 0 1021.33-.13A111.84 111.84 0 00193.5 32h19.84v2.67a8 8 0 008 8H248a8 8 0 008-8V8a8 8 0 00-8-8z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/pen-tool.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M162.62 162.53l17.14-27.87a10.65 10.65 0 00.8-9.6L137.89 20a10.68 10.68 0 00-19.78 0L75.44 125.06a10.71 10.71 0 00.8 9.6l17.14 27.87a18.56 18.56 0 00-9.2 13.68L74.74 247a7.94 7.94 0 007.93 9h90.67a8 8 0 007.92-9.07l-9.44-70.74a18.56 18.56 0 00-9.2-13.66zm-45.29-83.91v28.05a10.67 10.67 0 1021.34 0v-28l20.08 49.46L139.14 160h-22.29l-19.62-31.92z"></path><path class="fill-secondary" d="M248 0h-26.67a8 8 0 00-8 8v2.67H42.66V8a8 8 0 00-8-8H8a8 8 0 00-8 8v26.67a8 8 0 008 8h26.67a8 8 0 008-8V32h19.84a111.78 111.78 0 00-46.38 88.24 21.32 21.32 0 1021.33.13 90.58 90.58 0 01181.1 0 21.33 21.33 0 1021.33-.13A111.84 111.84 0 00193.5 32h19.84v2.67a8 8 0 008 8H248a8 8 0 008-8V8a8 8 0 00-8-8z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pen-tool</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/pen-tool.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/pen-tool.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.68 255.68" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/pie-chart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M212.59 223.57A127.92 127.92 0 11120 0v53.55a74.61 74.61 0 1054.83 132.27z"></path><path class="fill-primary" d="M255.68 135.68a125.81 125.81 0 01-31.79 76.59l-37.76-37.76a73.4 73.4 0 0016-38.83zm0-16h-53.55A74.45 74.45 0 00136 53.55V0a127.85 127.85 0 01119.68 119.68z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.68 255.68" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/pie-chart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M212.59 223.57A127.92 127.92 0 11120 0v53.55a74.61 74.61 0 1054.83 132.27z"></path><path class="fill-primary" d="M255.68 135.68a125.81 125.81 0 01-31.79 76.59l-37.76-37.76a73.4 73.4 0 0016-38.83zm0-16h-53.55A74.45 74.45 0 00136 53.55V0a127.85 127.85 0 01119.68 119.68z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pie-chart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/pie-chart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/pie-chart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.84" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/pin.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M10.67 255.84a10.68 10.68 0 01-7.54-18.23l86.08-86a10.67 10.67 0 1115.08 15.1l-86.08 86a10.61 10.61 0 01-7.54 3.13z"></path><path class="fill-primary" d="M250.54 80.72L175.12 5.29a19.12 19.12 0 00-26.4 0L138.3 15.71a27.18 27.18 0 00-6.61 27.93A11.25 11.25 0 01129 55.21L98.38 85.79a13.3 13.3 0 01-9.38 3.9H76.46a29.11 29.11 0 00-20.73 8.59l-5.06 5.06a18.66 18.66 0 000 26.4l75.42 75.42a18.64 18.64 0 0026.4 0l5.06-5.07a29.12 29.12 0 008.59-20.73v-12.5a13.43 13.43 0 013.91-9.42l30.57-30.58a11.24 11.24 0 0111.57-2.74 27.14 27.14 0 0027.92-6.6l10.42-10.42a18.65 18.65 0 000-26.38z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 255.84" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/pin.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M10.67 255.84a10.68 10.68 0 01-7.54-18.23l86.08-86a10.67 10.67 0 1115.08 15.1l-86.08 86a10.61 10.61 0 01-7.54 3.13z"></path><path class="fill-primary" d="M250.54 80.72L175.12 5.29a19.12 19.12 0 00-26.4 0L138.3 15.71a27.18 27.18 0 00-6.61 27.93A11.25 11.25 0 01129 55.21L98.38 85.79a13.3 13.3 0 01-9.38 3.9H76.46a29.11 29.11 0 00-20.73 8.59l-5.06 5.06a18.66 18.66 0 000 26.4l75.42 75.42a18.64 18.64 0 0026.4 0l5.06-5.07a29.12 29.12 0 008.59-20.73v-12.5a13.43 13.43 0 013.91-9.42l30.57-30.58a11.24 11.24 0 0111.57-2.74 27.14 27.14 0 0027.92-6.6l10.42-10.42a18.65 18.65 0 000-26.38z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">pin</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/pin.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/pin.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 255.99" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/plane.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M79.28 256c-.48 0-.94 0-1.42-.05a18.3 18.3 0 01-13.41-7.47l-22.32-30.6a9.1 9.1 0 00-1.9-1.92L7.49 191.83A18.39 18.39 0 015.38 164a19.11 19.11 0 0121.3-4l24.8 10.83 50.44-54.35a3.23 3.23 0 00-.72-5L14.42 65.59a19.23 19.23 0 01-4.05-30.29 16.79 16.79 0 0115.68-4.59l126.83 26.87a3.33 3.33 0 003.11-.93l45.49-48.32C206.34 3.18 214.53.15 224 0c9.65-.18 18.74 2.89 23.94 8.11s8.24 14.18 8.09 24c-.12 9.44-3.16 17.63-8.3 22.48l-48.44 45.67a3.26 3.26 0 00-1 3.13l29.18 128.31a16.9 16.9 0 01-4.56 15.93 19.21 19.21 0 01-30-3.52l-48.51-89.73a3 3 0 00-2.09-1.12 3.15 3.15 0 00-2.61.83L85.46 204.5l10.83 24.82a19.13 19.13 0 01-4 21.3 18.46 18.46 0 01-13 5.37zM242.2 48.73z" data-name="Layer 1"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 255.99" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/plane.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M79.28 256c-.48 0-.94 0-1.42-.05a18.3 18.3 0 01-13.41-7.47l-22.32-30.6a9.1 9.1 0 00-1.9-1.92L7.49 191.83A18.39 18.39 0 015.38 164a19.11 19.11 0 0121.3-4l24.8 10.83 50.44-54.35a3.23 3.23 0 00-.72-5L14.42 65.59a19.23 19.23 0 01-4.05-30.29 16.79 16.79 0 0115.68-4.59l126.83 26.87a3.33 3.33 0 003.11-.93l45.49-48.32C206.34 3.18 214.53.15 224 0c9.65-.18 18.74 2.89 23.94 8.11s8.24 14.18 8.09 24c-.12 9.44-3.16 17.63-8.3 22.48l-48.44 45.67a3.26 3.26 0 00-1 3.13l29.18 128.31a16.9 16.9 0 01-4.56 15.93 19.21 19.21 0 01-30-3.52l-48.51-89.73a3 3 0 00-2.09-1.12 3.15 3.15 0 00-2.61.83L85.46 204.5l10.83 24.82a19.13 19.13 0 01-4 21.3 18.46 18.46 0 01-13 5.37zM242.2 48.73z" data-name="Layer 1"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">plane</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/plane.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/plane.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/price-tag.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M228.59 256h-83.84a27.81 27.81 0 01-19.25-7.7 26.59 26.59 0 01-8.16-19v-30.69a10.68 10.68 0 0121.35 0v30.72a5.26 5.26 0 001.66 3.65 6.5 6.5 0 004.42 1.69h83.84A6.38 6.38 0 00233 233a5.27 5.27 0 001.67-3.65V104a5.27 5.27 0 00-1.67-3.65l-42.31-45.76a5.79 5.79 0 00-4.69-1.13 10.67 10.67 0 01-3.92-21A27.07 27.07 0 01206 39.7l42.32 45.72A26.47 26.47 0 01256 104v125.33a26.62 26.62 0 01-8.16 19 27.79 27.79 0 01-19.25 7.7z"></path><path class="fill-primary" d="M90.67 234.67a26.83 26.83 0 01-18.85-7.82l-64-64a26.63 26.63 0 010-37.7l85.33-85.33A26.83 26.83 0 01112 32h64a21.26 21.26 0 015.25.64c11.79 1.79 21.41 13.06 21.41 26v64a26.8 26.8 0 01-7.83 18.85l-85.33 85.36a26.78 26.78 0 01-18.83 7.82zM112 53.33a5.34 5.34 0 00-3.76 1.57l-85.33 85.32a5.3 5.3 0 000 7.54l64 64a5.52 5.52 0 007.53 0l85.33-85.33a5.42 5.42 0 001.57-3.76v-64a5.16 5.16 0 00-4.34-5.13z"></path><circle class="fill-primary" cx="154.67" cy="80" r="16"></circle><path class="fill-primary" d="M234.67 45.33v25.39l-21.33-23v-2.39a24 24 0 00-48 0V80A10.67 10.67 0 01144 80V45.33a45.34 45.34 0 0190.67 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/price-tag.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M228.59 256h-83.84a27.81 27.81 0 01-19.25-7.7 26.59 26.59 0 01-8.16-19v-30.69a10.68 10.68 0 0121.35 0v30.72a5.26 5.26 0 001.66 3.65 6.5 6.5 0 004.42 1.69h83.84A6.38 6.38 0 00233 233a5.27 5.27 0 001.67-3.65V104a5.27 5.27 0 00-1.67-3.65l-42.31-45.76a5.79 5.79 0 00-4.69-1.13 10.67 10.67 0 01-3.92-21A27.07 27.07 0 01206 39.7l42.32 45.72A26.47 26.47 0 01256 104v125.33a26.62 26.62 0 01-8.16 19 27.79 27.79 0 01-19.25 7.7z"></path><path class="fill-primary" d="M90.67 234.67a26.83 26.83 0 01-18.85-7.82l-64-64a26.63 26.63 0 010-37.7l85.33-85.33A26.83 26.83 0 01112 32h64a21.26 21.26 0 015.25.64c11.79 1.79 21.41 13.06 21.41 26v64a26.8 26.8 0 01-7.83 18.85l-85.33 85.36a26.78 26.78 0 01-18.83 7.82zM112 53.33a5.34 5.34 0 00-3.76 1.57l-85.33 85.32a5.3 5.3 0 000 7.54l64 64a5.52 5.52 0 007.53 0l85.33-85.33a5.42 5.42 0 001.57-3.76v-64a5.16 5.16 0 00-4.34-5.13z"></path><circle class="fill-primary" cx="154.67" cy="80" r="16"></circle><path class="fill-primary" d="M234.67 45.33v25.39l-21.33-23v-2.39a24 24 0 00-48 0V80A10.67 10.67 0 01144 80V45.33a45.34 45.34 0 0190.67 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">price-tag</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/price-tag.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/price-tag.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/printer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M181.33 0H74.66a32 32 0 00-32 32v42.67a10.67 10.67 0 0021.34 0V32a10.67 10.67 0 0110.67-10.67H182.4a9.6 9.6 0 019.6 9.6v43.73a10.67 10.67 0 0021.34 0V32a32 32 0 00-32.01-32z"></path><path class="fill-primary" d="M226.67 64H29.33A29.32 29.32 0 000 93.33v69.33A29.32 29.32 0 0029.33 192H64v-32h128v32h34.67A29.32 29.32 0 00256 162.67V93.34A29.32 29.32 0 00226.67 64z"></path><path class="fill-secondary" d="M202.66 138.66H53.33a10.66 10.66 0 00-10.67 10.67V224a32 32 0 0032 32h106.67a32 32 0 0032-32v-74.67a10.68 10.68 0 00-10.67-10.67zm-40 85.34H93.34a8 8 0 010-16h69.33a8 8 0 010 16zm0-32H93.34a8 8 0 010-16h69.33a8 8 0 010 16z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">printer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/printer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/printer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/push-cart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M216 101.33H82.67a8.06 8.06 0 00-8 8v75.2a41.94 41.94 0 0120.91 18.13H216a8.07 8.07 0 008-8v-85.33a8.06 8.06 0 00-8-8zm-21.33 69.34h-32a8 8 0 010-16h32a8 8 0 010 16zM173.33 0H82.66a8 8 0 00-8 8v74.67a8 8 0 008 8h90.67a8 8 0 008-8V8a8 8 0 00-8-8zM152 74.67h-21.33a8 8 0 110-16H152a8 8 0 010 16z"></path><path class="fill-primary" d="M252.43 237.38l-14.33-12.79a31.8 31.8 0 00-24.35-11.25H88.7A31.94 31.94 0 0064 192.51V21.76A21.38 21.38 0 0042.91.43L10.82 0h-.15a10.67 10.67 0 00-.16 21.33l32.15.43v174.66a31.91 31.91 0 1046 38.25h125.09a10.63 10.63 0 018.33 4 11.38 11.38 0 001.22 1.33l14.93 13.33a10.69 10.69 0 007.1 2.7 10.67 10.67 0 007.1-18.62z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/push-cart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M216 101.33H82.67a8.06 8.06 0 00-8 8v75.2a41.94 41.94 0 0120.91 18.13H216a8.07 8.07 0 008-8v-85.33a8.06 8.06 0 00-8-8zm-21.33 69.34h-32a8 8 0 010-16h32a8 8 0 010 16zM173.33 0H82.66a8 8 0 00-8 8v74.67a8 8 0 008 8h90.67a8 8 0 008-8V8a8 8 0 00-8-8zM152 74.67h-21.33a8 8 0 110-16H152a8 8 0 010 16z"></path><path class="fill-primary" d="M252.43 237.38l-14.33-12.79a31.8 31.8 0 00-24.35-11.25H88.7A31.94 31.94 0 0064 192.51V21.76A21.38 21.38 0 0042.91.43L10.82 0h-.15a10.67 10.67 0 00-.16 21.33l32.15.43v174.66a31.91 31.91 0 1046 38.25h125.09a10.63 10.63 0 018.33 4 11.38 11.38 0 001.22 1.33l14.93 13.33a10.69 10.69 0 007.1 2.7 10.67 10.67 0 007.1-18.62z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">push-cart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/push-cart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/push-cart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.97 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/puzzle.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M221.86 91a33.65 33.65 0 01-22.72-8.75v40.21h-27.2a43.26 43.26 0 003.73-17.71 44.8 44.8 0 10-86 17.71H56.85v-111A11.42 11.42 0 0168.26 0h119.47a11.42 11.42 0 0111.41 11.41v20.05A34.1 34.1 0 11221.86 91z"></path><path class="fill-primary" d="M142.79 181.25a34.13 34.13 0 0033.55 40.62 33.66 33.66 0 0022.75-8.77v31.52A11.41 11.41 0 01187.72 256H68.28a11.41 11.41 0 01-11.38-11.38V213.1a34.12 34.12 0 11-22.75-59.5 33.71 33.71 0 0122.75 8.77v-29.2H112a34.12 34.12 0 1137.76 0h49.37v29.2a34.09 34.09 0 00-56.3 18.88z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.97 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/puzzle.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M221.86 91a33.65 33.65 0 01-22.72-8.75v40.21h-27.2a43.26 43.26 0 003.73-17.71 44.8 44.8 0 10-86 17.71H56.85v-111A11.42 11.42 0 0168.26 0h119.47a11.42 11.42 0 0111.41 11.41v20.05A34.1 34.1 0 11221.86 91z"></path><path class="fill-primary" d="M142.79 181.25a34.13 34.13 0 0033.55 40.62 33.66 33.66 0 0022.75-8.77v31.52A11.41 11.41 0 01187.72 256H68.28a11.41 11.41 0 01-11.38-11.38V213.1a34.12 34.12 0 11-22.75-59.5 33.71 33.71 0 0122.75 8.77v-29.2H112a34.12 34.12 0 1137.76 0h49.37v29.2a34.09 34.09 0 00-56.3 18.88z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">puzzle</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/puzzle.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/puzzle.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M250.75 0c-50-.89-107 25.22-143 65.75a135.36 135.36 0 00-92.77 39.5 5.32 5.32 0 003 9.07L59 120.23l-5 5.68a5.34 5.34 0 00.2 7.33l68.56 68.56a5.32 5.32 0 007.33.21l5.68-5.08 5.86 41.07a5.31 5.31 0 003.78 4.11 4.88 4.88 0 001.52.24 6.06 6.06 0 004.12-1.71 135 135 0 0039.16-92.42c40.57-36.14 66.89-93.12 65.74-143a5.33 5.33 0 00-5.2-5.2zM201.6 92.1a26.66 26.66 0 110-37.71 26.57 26.57 0 010 37.71z"></path><path class="fill-secondary" d="M29.05 180.31C17.63 191.72 2 243.3.22 249.14A5.36 5.36 0 005.33 256a5.41 5.41 0 001.53-.23c5.84-1.74 57.41-17.42 68.83-28.85a33 33 0 00-46.64-46.62z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.99 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rocket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M250.75 0c-50-.89-107 25.22-143 65.75a135.36 135.36 0 00-92.77 39.5 5.32 5.32 0 003 9.07L59 120.23l-5 5.68a5.34 5.34 0 00.2 7.33l68.56 68.56a5.32 5.32 0 007.33.21l5.68-5.08 5.86 41.07a5.31 5.31 0 003.78 4.11 4.88 4.88 0 001.52.24 6.06 6.06 0 004.12-1.71 135 135 0 0039.16-92.42c40.57-36.14 66.89-93.12 65.74-143a5.33 5.33 0 00-5.2-5.2zM201.6 92.1a26.66 26.66 0 110-37.71 26.57 26.57 0 010 37.71z"></path><path class="fill-secondary" d="M29.05 180.31C17.63 191.72 2 243.3.22 249.14A5.36 5.36 0 005.33 256a5.41 5.41 0 001.53-.23c5.84-1.74 57.41-17.42 68.83-28.85a33 33 0 00-46.64-46.62z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">rocket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/rocket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/rocket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/roller.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M184 0H29.33A29.35 29.35 0 000 29.33v37.33A29.36 29.36 0 0029.33 96H184a29.35 29.35 0 0029.33-29.33V29.34A29.36 29.36 0 00184 0z"></path><path class="fill-secondary" d="M229.33 37.33h-16v21.33h16a5.33 5.33 0 015.33 5.34v48a5.33 5.33 0 01-5.33 5.33H122.66a32 32 0 00-32 32V160H112v-10.67a10.69 10.69 0 0110.67-10.67h106.67A26.68 26.68 0 00256 112V64a26.69 26.69 0 00-26.67-26.67z"></path><path class="fill-primary" d="M120 160H82.67A18.68 18.68 0 0064 178.67v58.67A18.68 18.68 0 0082.67 256H120a18.69 18.69 0 0018.67-18.67v-58.67A18.69 18.69 0 00120 160z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/roller.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M184 0H29.33A29.35 29.35 0 000 29.33v37.33A29.36 29.36 0 0029.33 96H184a29.35 29.35 0 0029.33-29.33V29.34A29.36 29.36 0 00184 0z"></path><path class="fill-secondary" d="M229.33 37.33h-16v21.33h16a5.33 5.33 0 015.33 5.34v48a5.33 5.33 0 01-5.33 5.33H122.66a32 32 0 00-32 32V160H112v-10.67a10.69 10.69 0 0110.67-10.67h106.67A26.68 26.68 0 00256 112V64a26.69 26.69 0 00-26.67-26.67z"></path><path class="fill-primary" d="M120 160H82.67A18.68 18.68 0 0064 178.67v58.67A18.68 18.68 0 0082.67 256H120a18.69 18.69 0 0018.67-18.67v-58.67A18.69 18.69 0 00120 160z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">roller</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/roller.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/roller.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rotary.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M128 106.67a128.15 128.15 0 00-128 128A21.36 21.36 0 0021.34 256h213.32A21.36 21.36 0 00256 234.67c0-70.57-57.42-128-128-128zM128 224a42.67 42.67 0 1142.67-42.67A42.71 42.71 0 01128 224z"></path><path class="fill-primary" d="M33.45 117.34a22.89 22.89 0 01-12.56-3.69 50.7 50.7 0 01-6.61-5.12A43.84 43.84 0 01.74 68.3C5.45 43.31 33.27 27.06 53.8 17A169.32 169.32 0 01128 0c34.77 0 69.86 10.62 96.26 29.14 11.95 8.4 26.22 20.11 30.4 36.41a44 44 0 01-12.93 43 49.9 49.9 0 01-6.49 5 23.84 23.84 0 01-26.87-.76L171.1 86.18c-8.32-5.94-11.64-16.42-8.08-25.52.19-.53.41-1 .64-1.56a113 113 0 00-71.33 0l.67 1.54c3.57 9.1.22 19.6-8.08 25.52l-37.3 26.61a24.15 24.15 0 01-14.14 4.57z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.01 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/rotary.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M128 106.67a128.15 128.15 0 00-128 128A21.36 21.36 0 0021.34 256h213.32A21.36 21.36 0 00256 234.67c0-70.57-57.42-128-128-128zM128 224a42.67 42.67 0 1142.67-42.67A42.71 42.71 0 01128 224z"></path><path class="fill-primary" d="M33.45 117.34a22.89 22.89 0 01-12.56-3.69 50.7 50.7 0 01-6.61-5.12A43.84 43.84 0 01.74 68.3C5.45 43.31 33.27 27.06 53.8 17A169.32 169.32 0 01128 0c34.77 0 69.86 10.62 96.26 29.14 11.95 8.4 26.22 20.11 30.4 36.41a44 44 0 01-12.93 43 49.9 49.9 0 01-6.49 5 23.84 23.84 0 01-26.87-.76L171.1 86.18c-8.32-5.94-11.64-16.42-8.08-25.52.19-.53.41-1 .64-1.56a113 113 0 00-71.33 0l.67 1.54c3.57 9.1.22 19.6-8.08 25.52l-37.3 26.61a24.15 24.15 0 01-14.14 4.57z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">rotary</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/rotary.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/rotary.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/safe.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M186.58 19.47l-56-19a8 8 0 00-5.16 0l-56 19A8 8 0 0064 27.06v42.86c0 52.32 58.38 77.73 60.88 78.8a8.1 8.1 0 003.12.64 7.85 7.85 0 003.12-.64c2.5-1.07 60.88-26.5 60.88-78.82V27.06a8 8 0 00-5.42-7.59zm-23.52 40.45l-29.33 37.33a10.67 10.67 0 01-7.35 4h-1a10.7 10.7 0 01-6.94-2.56l-18.67-16a10.66 10.66 0 0113.83-16.11l10.22 8.75 22.47-28.58a10.66 10.66 0 0116.77 13.17z"></path><path class="fill-primary" d="M237.34 42.67h-24V64h21.33v117.33H21.33V64h21.33V42.67h-24A18.74 18.74 0 000 61.33v144A18.75 18.75 0 0018.66 224h81.69c-1.25 5.34-4.57 14-13.45 22.9a5.33 5.33 0 003.77 9.1h74.67a5.34 5.34 0 003.78-9.1c-8.86-8.87-12.27-17.54-13.6-22.9h81.82A18.75 18.75 0 00256 205.33v-144a18.74 18.74 0 00-18.66-18.66z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/safe.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M186.58 19.47l-56-19a8 8 0 00-5.16 0l-56 19A8 8 0 0064 27.06v42.86c0 52.32 58.38 77.73 60.88 78.8a8.1 8.1 0 003.12.64 7.85 7.85 0 003.12-.64c2.5-1.07 60.88-26.5 60.88-78.82V27.06a8 8 0 00-5.42-7.59zm-23.52 40.45l-29.33 37.33a10.67 10.67 0 01-7.35 4h-1a10.7 10.7 0 01-6.94-2.56l-18.67-16a10.66 10.66 0 0113.83-16.11l10.22 8.75 22.47-28.58a10.66 10.66 0 0116.77 13.17z"></path><path class="fill-primary" d="M237.34 42.67h-24V64h21.33v117.33H21.33V64h21.33V42.67h-24A18.74 18.74 0 000 61.33v144A18.75 18.75 0 0018.66 224h81.69c-1.25 5.34-4.57 14-13.45 22.9a5.33 5.33 0 003.77 9.1h74.67a5.34 5.34 0 003.78-9.1c-8.86-8.87-12.27-17.54-13.6-22.9h81.82A18.75 18.75 0 00256 205.33v-144a18.74 18.74 0 00-18.66-18.66z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">safe</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/safe.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/safe.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/script.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M162.66 106.34a8 8 0 01-6.06-13.2l11.54-13.47-11.54-13.45a8 8 0 1112.14-10.42l16 18.67a8 8 0 010 10.42l-16 18.67a8 8 0 01-6.08 2.78zm-69.31 0a8 8 0 01-6.08-2.78l-16-18.67a8 8 0 010-10.42l16-18.67a8 8 0 0112.15 10.42L87.88 79.67l11.54 13.46a8 8 0 01-6.07 13.21zm24.87 15.8a8 8 0 01-6-9.6l16-69.33a8 8 0 1115.6 3.6l-16 69.33a8 8 0 01-9.6 6z"></path><path class="fill-primary" d="M237.33 0H18.67A18.76 18.76 0 000 18.67v144a18.76 18.76 0 0018.67 18.67h81.68c-1.25 5.35-4.57 14-13.45 22.9a5.33 5.33 0 003.77 9.1h74.67a5.33 5.33 0 003.78-9.1c-8.86-8.86-12.27-17.54-13.6-22.9h81.82A18.77 18.77 0 00256 162.67v-144A18.79 18.79 0 00237.33 0zm-2.66 138.67H21.33V21.34h213.33v117.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/script.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M162.66 106.34a8 8 0 01-6.06-13.2l11.54-13.47-11.54-13.45a8 8 0 1112.14-10.42l16 18.67a8 8 0 010 10.42l-16 18.67a8 8 0 01-6.08 2.78zm-69.31 0a8 8 0 01-6.08-2.78l-16-18.67a8 8 0 010-10.42l16-18.67a8 8 0 0112.15 10.42L87.88 79.67l11.54 13.46a8 8 0 01-6.07 13.21zm24.87 15.8a8 8 0 01-6-9.6l16-69.33a8 8 0 1115.6 3.6l-16 69.33a8 8 0 01-9.6 6z"></path><path class="fill-primary" d="M237.33 0H18.67A18.76 18.76 0 000 18.67v144a18.76 18.76 0 0018.67 18.67h81.68c-1.25 5.35-4.57 14-13.45 22.9a5.33 5.33 0 003.77 9.1h74.67a5.33 5.33 0 003.78-9.1c-8.86-8.86-12.27-17.54-13.6-22.9h81.82A18.77 18.77 0 00256 162.67v-144A18.79 18.79 0 00237.33 0zm-2.66 138.67H21.33V21.34h213.33v117.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">script</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/script.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/script.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/search.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M117.15 74.85a53.33 53.33 0 1053.33 53.33 53.39 53.39 0 00-53.33-53.33zm0 85.33a32 32 0 1132-32 32 32 0 01-32 32z"></path><path class="fill-secondary" d="M149.7 149.68a10.61 10.61 0 017.53 3.12l31.65 31.65a10.67 10.67 0 01-15.09 15.09l-31.65-31.65a10.67 10.67 0 017.56-18.21z"></path><path class="fill-primary" d="M224 0H32A32 32 0 000 32v170.67a32 32 0 0032 32h192a32 32 0 0032-32V32a32 32 0 00-32-32zm0 213.33H32a10.68 10.68 0 01-10.67-10.67V53.33h213.33v149.33A10.67 10.67 0 01224 213.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/search.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M117.15 74.85a53.33 53.33 0 1053.33 53.33 53.39 53.39 0 00-53.33-53.33zm0 85.33a32 32 0 1132-32 32 32 0 01-32 32z"></path><path class="fill-secondary" d="M149.7 149.68a10.61 10.61 0 017.53 3.12l31.65 31.65a10.67 10.67 0 01-15.09 15.09l-31.65-31.65a10.67 10.67 0 017.56-18.21z"></path><path class="fill-primary" d="M224 0H32A32 32 0 000 32v170.67a32 32 0 0032 32h192a32 32 0 0032-32V32a32 32 0 00-32-32zm0 213.33H32a10.68 10.68 0 01-10.67-10.67V53.33h213.33v149.33A10.67 10.67 0 01224 213.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">search</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/search.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/search.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/secure.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M186.58 126.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.19 8.19 0 003.12.62 7.85 7.85 0 003.12-.64c2.5-1.06 60.88-26.48 60.88-78.78v-42.87a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.67 10.67 0 01-7.35 4c-.35 0-.7.05-1 .05a10.71 10.71 0 01-7-2.56l-18.67-16a10.66 10.66 0 0113.87-16.19l10.23 8.78 22.46-28.58a10.67 10.67 0 0116.79 13.17z"></path><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h31.79a103.44 103.44 0 01-13.12-21.33H32a10.7 10.7 0 01-10.67-10.67V53.34h213.34v149.33A10.7 10.7 0 01224 213.34h-18.67a106.83 106.83 0 01-13 21.33H224a32.09 32.09 0 0032-32V32a32.09 32.09 0 00-32-32z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/secure.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M186.58 126.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.19 8.19 0 003.12.62 7.85 7.85 0 003.12-.64c2.5-1.06 60.88-26.48 60.88-78.78v-42.87a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.67 10.67 0 01-7.35 4c-.35 0-.7.05-1 .05a10.71 10.71 0 01-7-2.56l-18.67-16a10.66 10.66 0 0113.87-16.19l10.23 8.78 22.46-28.58a10.67 10.67 0 0116.79 13.17z"></path><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h31.79a103.44 103.44 0 01-13.12-21.33H32a10.7 10.7 0 01-10.67-10.67V53.34h213.34v149.33A10.7 10.7 0 01224 213.34h-18.67a106.83 106.83 0 01-13 21.33H224a32.09 32.09 0 0032-32V32a32.09 32.09 0 00-32-32z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">secure</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/secure.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/secure.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/selected.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M181.33 93.33a18.69 18.69 0 00-18.67-18.67h-144A18.7 18.7 0 000 93.33v144A18.68 18.68 0 0018.67 256h144a18.69 18.69 0 0018.67-18.67v-144z"></path><path class="fill-secondary" d="M245.34 53.33a10.69 10.69 0 01-10.67-10.67V32A10.67 10.67 0 00224 21.33h-10.67a10.67 10.67 0 110-21.33H224a32 32 0 0132 32v10.67a10.66 10.66 0 01-10.66 10.66zm-192 0a10.69 10.69 0 01-10.67-10.67V32a32 32 0 0132-32h10.67a10.67 10.67 0 010 21.34H74.66A10.66 10.66 0 0064 32v10.67a10.66 10.66 0 01-10.66 10.66zm117.33-32H128A10.67 10.67 0 11128 0h42.67a10.67 10.67 0 110 21.33zm53.33 192h-10.67a10.67 10.67 0 110-21.33H224a10.67 10.67 0 0010.67-10.67v-10.67a10.67 10.67 0 1121.33 0v10.67a32 32 0 01-32 32zm21.34-74.66A10.68 10.68 0 01234.67 128V85.33a10.67 10.67 0 1121.33 0V128a10.67 10.67 0 01-10.66 10.67z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/selected.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M181.33 93.33a18.69 18.69 0 00-18.67-18.67h-144A18.7 18.7 0 000 93.33v144A18.68 18.68 0 0018.67 256h144a18.69 18.69 0 0018.67-18.67v-144z"></path><path class="fill-secondary" d="M245.34 53.33a10.69 10.69 0 01-10.67-10.67V32A10.67 10.67 0 00224 21.33h-10.67a10.67 10.67 0 110-21.33H224a32 32 0 0132 32v10.67a10.66 10.66 0 01-10.66 10.66zm-192 0a10.69 10.69 0 01-10.67-10.67V32a32 32 0 0132-32h10.67a10.67 10.67 0 010 21.34H74.66A10.66 10.66 0 0064 32v10.67a10.66 10.66 0 01-10.66 10.66zm117.33-32H128A10.67 10.67 0 11128 0h42.67a10.67 10.67 0 110 21.33zm53.33 192h-10.67a10.67 10.67 0 110-21.33H224a10.67 10.67 0 0010.67-10.67v-10.67a10.67 10.67 0 1121.33 0v10.67a32 32 0 01-32 32zm21.34-74.66A10.68 10.68 0 01234.67 128V85.33a10.67 10.67 0 1121.33 0V128a10.67 10.67 0 01-10.66 10.67z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">selected</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/selected.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/selected.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/seo-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M194.67 48h-5.33a2.68 2.68 0 00-2.67 2.67v26.67a2.68 2.68 0 002.67 2.66h5.33a2.68 2.68 0 002.67-2.68V50.67a2.69 2.69 0 00-2.67-2.67z"></path><path class="fill-primary" d="M226.67 0H29.33A29.32 29.32 0 000 29.33v69.33a29.28 29.28 0 0017.6 26.88 41.68 41.68 0 0125.07-8.21A42.44 42.44 0 0170.83 128H82a53 53 0 0192 0h11.2a42.49 42.49 0 0128.16-10.67 41.81 41.81 0 0125.07 8.21A29.28 29.28 0 00256 98.66V29.33A29.32 29.32 0 00226.67 0zM61.76 56h4.48c10.56 0 19.09 9 19.09 20S76.8 96 66.24 96H50.67a8 8 0 010-16h15.57c1.71 0 3.09-1.81 3.09-4s-1.39-4-3.09-4h-4.48c-10.56 0-19.09-9-19.09-20s8.53-20 19.09-20h15.57a8 8 0 010 16H61.76c-1.71 0-3.09 1.81-3.09 4s1.38 4 3.09 4zm79.57 0a8 8 0 010 16h-18.67v5.33a2.64 2.64 0 002.67 2.67h16a8 8 0 010 16h-16a18.76 18.76 0 01-18.67-18.67V50.66A18.77 18.77 0 01125.33 32h16a8 8 0 110 16h-16a2.65 2.65 0 00-2.67 2.68V56zm72 21.33A18.76 18.76 0 01194.66 96h-5.33a18.76 18.76 0 01-18.67-18.67V50.66A18.77 18.77 0 01189.33 32h5.33a18.77 18.77 0 0118.67 18.68z"></path><circle class="fill-secondary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-secondary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-secondary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-secondary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-secondary" cx="128" cy="154.67" r="32"></circle><path class="fill-secondary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/seo-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M194.67 48h-5.33a2.68 2.68 0 00-2.67 2.67v26.67a2.68 2.68 0 002.67 2.66h5.33a2.68 2.68 0 002.67-2.68V50.67a2.69 2.69 0 00-2.67-2.67z"></path><path class="fill-primary" d="M226.67 0H29.33A29.32 29.32 0 000 29.33v69.33a29.28 29.28 0 0017.6 26.88 41.68 41.68 0 0125.07-8.21A42.44 42.44 0 0170.83 128H82a53 53 0 0192 0h11.2a42.49 42.49 0 0128.16-10.67 41.81 41.81 0 0125.07 8.21A29.28 29.28 0 00256 98.66V29.33A29.32 29.32 0 00226.67 0zM61.76 56h4.48c10.56 0 19.09 9 19.09 20S76.8 96 66.24 96H50.67a8 8 0 010-16h15.57c1.71 0 3.09-1.81 3.09-4s-1.39-4-3.09-4h-4.48c-10.56 0-19.09-9-19.09-20s8.53-20 19.09-20h15.57a8 8 0 010 16H61.76c-1.71 0-3.09 1.81-3.09 4s1.38 4 3.09 4zm79.57 0a8 8 0 010 16h-18.67v5.33a2.64 2.64 0 002.67 2.67h16a8 8 0 010 16h-16a18.76 18.76 0 01-18.67-18.67V50.66A18.77 18.77 0 01125.33 32h16a8 8 0 110 16h-16a2.65 2.65 0 00-2.67 2.68V56zm72 21.33A18.76 18.76 0 01194.66 96h-5.33a18.76 18.76 0 01-18.67-18.67V50.66A18.77 18.77 0 01189.33 32h5.33a18.77 18.77 0 0118.67 18.68z"></path><circle class="fill-secondary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-secondary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-secondary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-secondary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-secondary" cx="128" cy="154.67" r="32"></circle><path class="fill-secondary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">seo-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/seo-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/seo-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 213.34 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/seo.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M106.67 22.22L192 53.81v76.06c0 71.62-68.77 98.71-85.33 104.19-16.75-5.55-85.34-32.65-85.34-104.19V53.81zm0-22.22a7.81 7.81 0 00-2.78.5L5.22 37A8 8 0 000 44.53v85.34C0 227 103.57 255.47 104.62 255.74a8 8 0 002 .26 8.36 8.36 0 002-.27c1.06-.27 104.62-28.79 104.62-125.87V44.51a8 8 0 00-5.21-7.5L109.46.48a8.31 8.31 0 00-2.79-.48z"></path><path class="fill-secondary" d="M51.12 109.33h4.43c10.55 0 19.12 9 19.12 20s-8.57 20-19.12 20H40a8 8 0 010-16h15.55c1.68 0 3.12-1.84 3.12-4s-1.42-4-3.12-4h-4.43c-10.54 0-19.12-9-19.12-20s8.58-20 19.12-20h15.55a8 8 0 010 16H51.12c-1.68 0-3.12 1.84-3.12 4s1.44 4 3.12 4zm68.88 0a8 8 0 010 16h-18.67v5.33a2.68 2.68 0 002.67 2.67h16a8 8 0 110 16h-16a18.69 18.69 0 01-18.67-18.67V104A18.69 18.69 0 01104 85.33h16a8 8 0 010 16h-16a2.68 2.68 0 00-2.67 2.67v5.33zm42.67-24h-5.33A18.69 18.69 0 00138.67 104v26.67a18.69 18.69 0 0018.67 18.67h5.33a18.68 18.68 0 0018.67-18.67V104a18.7 18.7 0 00-18.67-18.67zm2.67 45.34a2.68 2.68 0 01-2.67 2.67h-5.33a2.68 2.68 0 01-2.67-2.67V104a2.68 2.68 0 012.67-2.67h5.33a2.68 2.68 0 012.67 2.67z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 213.34 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/seo.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M106.67 22.22L192 53.81v76.06c0 71.62-68.77 98.71-85.33 104.19-16.75-5.55-85.34-32.65-85.34-104.19V53.81zm0-22.22a7.81 7.81 0 00-2.78.5L5.22 37A8 8 0 000 44.53v85.34C0 227 103.57 255.47 104.62 255.74a8 8 0 002 .26 8.36 8.36 0 002-.27c1.06-.27 104.62-28.79 104.62-125.87V44.51a8 8 0 00-5.21-7.5L109.46.48a8.31 8.31 0 00-2.79-.48z"></path><path class="fill-secondary" d="M51.12 109.33h4.43c10.55 0 19.12 9 19.12 20s-8.57 20-19.12 20H40a8 8 0 010-16h15.55c1.68 0 3.12-1.84 3.12-4s-1.42-4-3.12-4h-4.43c-10.54 0-19.12-9-19.12-20s8.58-20 19.12-20h15.55a8 8 0 010 16H51.12c-1.68 0-3.12 1.84-3.12 4s1.44 4 3.12 4zm68.88 0a8 8 0 010 16h-18.67v5.33a2.68 2.68 0 002.67 2.67h16a8 8 0 110 16h-16a18.69 18.69 0 01-18.67-18.67V104A18.69 18.69 0 01104 85.33h16a8 8 0 010 16h-16a2.68 2.68 0 00-2.67 2.67v5.33zm42.67-24h-5.33A18.69 18.69 0 00138.67 104v26.67a18.69 18.69 0 0018.67 18.67h5.33a18.68 18.68 0 0018.67-18.67V104a18.7 18.7 0 00-18.67-18.67zm2.67 45.34a2.68 2.68 0 01-2.67 2.67h-5.33a2.68 2.68 0 01-2.67-2.67V104a2.68 2.68 0 012.67-2.67h5.33a2.68 2.68 0 012.67 2.67z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">seo</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/seo.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/seo.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/server.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M250.58 126.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.19 8.19 0 003.12.62 7.85 7.85 0 003.12-.64c2.5-1.06 60.88-26.48 60.88-78.78v-42.87a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.66 10.66 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19l10.22 8.77 22.47-28.57a10.66 10.66 0 0116.77 13.18z"></path><path class="fill-primary" d="M202.67 0H32a32 32 0 000 64h170.67a32 32 0 000-64zM32 42.67A10.67 10.67 0 1142.67 32 10.67 10.67 0 0132 42.67zm42.67 0A10.67 10.67 0 1185.34 32a10.67 10.67 0 01-10.67 10.67zM32 85.33a32 32 0 000 64h74.67v-15.57a29.38 29.38 0 0120-27.84l55.89-19a29 29 0 019.49-1.6zM32 128a10.67 10.67 0 1110.67-10.67A10.7 10.7 0 0132 128zm42.67 0a10.67 10.67 0 1110.67-10.67A10.7 10.7 0 0174.67 128zm32 48.53v-5.87H32a32 32 0 000 64h95.68c-12.27-15.57-21.01-35.09-21.01-58.13zM32 213.33a10.67 10.67 0 1110.67-10.66A10.7 10.7 0 0132 213.33zm42.67 0a10.67 10.67 0 1110.67-10.66 10.7 10.7 0 01-10.67 10.66z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/server.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M250.58 126.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.19 8.19 0 003.12.62 7.85 7.85 0 003.12-.64c2.5-1.06 60.88-26.48 60.88-78.78v-42.87a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.66 10.66 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19l10.22 8.77 22.47-28.57a10.66 10.66 0 0116.77 13.18z"></path><path class="fill-primary" d="M202.67 0H32a32 32 0 000 64h170.67a32 32 0 000-64zM32 42.67A10.67 10.67 0 1142.67 32 10.67 10.67 0 0132 42.67zm42.67 0A10.67 10.67 0 1185.34 32a10.67 10.67 0 01-10.67 10.67zM32 85.33a32 32 0 000 64h74.67v-15.57a29.38 29.38 0 0120-27.84l55.89-19a29 29 0 019.49-1.6zM32 128a10.67 10.67 0 1110.67-10.67A10.7 10.7 0 0132 128zm42.67 0a10.67 10.67 0 1110.67-10.67A10.7 10.7 0 0174.67 128zm32 48.53v-5.87H32a32 32 0 000 64h95.68c-12.27-15.57-21.01-35.09-21.01-58.13zM32 213.33a10.67 10.67 0 1110.67-10.66A10.7 10.7 0 0132 213.33zm42.67 0a10.67 10.67 0 1110.67-10.66 10.7 10.7 0 01-10.67 10.66z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">server</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/server.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/server.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/setting.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M177.81 73.28c.11-1.28.21-2.56.21-4s-.12-2.67-.21-4l8.85-6.52a13.19 13.19 0 003.63-17.07l-7.89-13.98a12.76 12.76 0 00-16.64-5.44L156 26.86a51.33 51.33 0 00-6.08-3.63l-1.12-11.39A13 13 0 00135.89 0H120.1a13 13 0 00-12.92 11.84l-1.07 11.41a51.33 51.33 0 00-6.11 3.63l-9.81-4.59a12.86 12.86 0 00-16.64 5.44L65.7 41.81a13.12 13.12 0 003.63 17.07l8.85 6.51c-.12 1.28-.21 2.56-.21 4s.11 2.68.21 4l-8.85 6.51a13.12 13.12 0 00-3.62 17l7.89 14.08a12.84 12.84 0 0016.64 5.44l9.81-4.59a51.33 51.33 0 006.08 3.63l1.07 11.41a13 13 0 0012.91 11.84h15.79a13 13 0 0012.92-11.84l1.07-11.41a51.33 51.33 0 006.08-3.63l9.81 4.59a12.76 12.76 0 0016.64-5.44l7.88-14.08a13.12 13.12 0 00-3.63-17.07zm-23.14-3.94A26.67 26.67 0 11128 42.67a26.69 26.69 0 0126.67 26.67z"></path><path class="fill-primary" d="M224 149.34H32a32 32 0 000 64h192a32 32 0 000-64zM42.67 192a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 0142.67 192zM96 192a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 0196 192zm64 0a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01160 192zm53.33 0A10.67 10.67 0 11224 181.34 10.67 10.67 0 01213.33 192z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/setting.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M177.81 73.28c.11-1.28.21-2.56.21-4s-.12-2.67-.21-4l8.85-6.52a13.19 13.19 0 003.63-17.07l-7.89-13.98a12.76 12.76 0 00-16.64-5.44L156 26.86a51.33 51.33 0 00-6.08-3.63l-1.12-11.39A13 13 0 00135.89 0H120.1a13 13 0 00-12.92 11.84l-1.07 11.41a51.33 51.33 0 00-6.11 3.63l-9.81-4.59a12.86 12.86 0 00-16.64 5.44L65.7 41.81a13.12 13.12 0 003.63 17.07l8.85 6.51c-.12 1.28-.21 2.56-.21 4s.11 2.68.21 4l-8.85 6.51a13.12 13.12 0 00-3.62 17l7.89 14.08a12.84 12.84 0 0016.64 5.44l9.81-4.59a51.33 51.33 0 006.08 3.63l1.07 11.41a13 13 0 0012.91 11.84h15.79a13 13 0 0012.92-11.84l1.07-11.41a51.33 51.33 0 006.08-3.63l9.81 4.59a12.76 12.76 0 0016.64-5.44l7.88-14.08a13.12 13.12 0 00-3.63-17.07zm-23.14-3.94A26.67 26.67 0 11128 42.67a26.69 26.69 0 0126.67 26.67z"></path><path class="fill-primary" d="M224 149.34H32a32 32 0 000 64h192a32 32 0 000-64zM42.67 192a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 0142.67 192zM96 192a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 0196 192zm64 0a10.67 10.67 0 1110.67-10.66A10.67 10.67 0 01160 192zm53.33 0A10.67 10.67 0 11224 181.34 10.67 10.67 0 01213.33 192z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">setting</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/setting.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/setting.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/share.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M219.1 108.48v7.68A11.89 11.89 0 01207.15 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zm26.24-60.8a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23h-44.06a20 20 0 00-7.79-12.69 47.13 47.13 0 01-18.24-38.4C149.86 21.34 171.09.33 196.58 0a47.34 47.34 0 0134.56 13.88 46.83 46.83 0 0114.2 33.79z"></path><path class="fill-primary" d="M5.25 117.34A5.34 5.34 0 000 122.67v98.64A2.68 2.68 0 002.67 224H28a5.33 5.33 0 005.13-3.87l23.6-83.18A10.66 10.66 0 0050.1 124c-9.67-3.52-24.5-7-44.85-6.66zM234.67 176c-21.33 0-64 27-85.33 27S104 186.65 104 186.65s28.74 5.35 45.33 5.35 21.33-5.66 21.33-13.33c0-18.67-31.72-21.56-47.75-24-15.74-8.76-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.5c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33S245.33 176 234.67 176z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/share.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M219.1 108.48v7.68A11.89 11.89 0 01207.15 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zm26.24-60.8a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23h-44.06a20 20 0 00-7.79-12.69 47.13 47.13 0 01-18.24-38.4C149.86 21.34 171.09.33 196.58 0a47.34 47.34 0 0134.56 13.88 46.83 46.83 0 0114.2 33.79z"></path><path class="fill-primary" d="M5.25 117.34A5.34 5.34 0 000 122.67v98.64A2.68 2.68 0 002.67 224H28a5.33 5.33 0 005.13-3.87l23.6-83.18A10.66 10.66 0 0050.1 124c-9.67-3.52-24.5-7-44.85-6.66zM234.67 176c-21.33 0-64 27-85.33 27S104 186.65 104 186.65s28.74 5.35 45.33 5.35 21.33-5.66 21.33-13.33c0-18.67-31.72-21.56-47.75-24-15.74-8.76-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.5c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33S245.33 176 234.67 176z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">share</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/share.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/share.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.69 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/sharing.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M67.87 122.88a10.67 10.67 0 01-5.29-19.94l99-56.43A10.67 10.67 0 01172.13 65l-99 56.43a10.59 10.59 0 01-5.28 1.41zm98.95 88a10.5 10.5 0 01-5.27-1.41L62.58 153a10.67 10.67 0 1110.57-18.53l99 56.43a10.67 10.67 0 01-5.31 19.94z"></path><circle class="fill-primary" cx="192.02" cy="213.33" r="42.67"></circle><circle class="fill-primary" cx="192.02" cy="42.67" r="42.67"></circle><circle class="fill-primary" cx="42.67" cy="128" r="42.67"></circle></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 234.69 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/sharing.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M67.87 122.88a10.67 10.67 0 01-5.29-19.94l99-56.43A10.67 10.67 0 01172.13 65l-99 56.43a10.59 10.59 0 01-5.28 1.41zm98.95 88a10.5 10.5 0 01-5.27-1.41L62.58 153a10.67 10.67 0 1110.57-18.53l99 56.43a10.67 10.67 0 01-5.31 19.94z"></path><circle class="fill-primary" cx="192.02" cy="213.33" r="42.67"></circle><circle class="fill-primary" cx="192.02" cy="42.67" r="42.67"></circle><circle class="fill-primary" cx="42.67" cy="128" r="42.67"></circle></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">sharing</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/sharing.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/sharing.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shipment.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M235.33 170.66h-13a10.68 10.68 0 110-21.35h12.33V115l-29.94-40.65-34.05.29v74.69H176a10.67 10.67 0 110 21.33h-16A10.68 10.68 0 01149.33 160V73.58A20.49 20.49 0 01170 53.31h35.12a20.88 20.88 0 0116.82 8.47l30.19 41.44A19.87 19.87 0 01256 115v35.4a20.48 20.48 0 01-20.67 20.26z"></path><path class="fill-primary" d="M160 170.66H89.81a10.68 10.68 0 010-21.35h59.52V20.59l-128.71.74.71 128.72 19.67-.72a10.67 10.67 0 110 21.34H20.62A20.66 20.66 0 010 150.05V20.62A20.64 20.64 0 0120.62 0h129.43a20.64 20.64 0 0120.62 20.62V160A10.67 10.67 0 01160 170.66z"></path><path class="fill-primary" d="M200 202.66a32 32 0 1132-32 32 32 0 01-32 32zm-136 0a32 32 0 1132-32 32 32 0 01-32 32z"></path><path class="fill-secondary" d="M41.47 89.33A9.29 9.29 0 0136 87.52 9.84 9.84 0 0133.76 74l23.71-33.94a9.35 9.35 0 0113.22-2.25 9.85 9.85 0 012.21 13.52L49.18 85.26a9.35 9.35 0 01-7.71 4.07zm64 32a9.29 9.29 0 01-5.5-1.81A9.86 9.86 0 0197.76 106l23.71-33.93a9.36 9.36 0 0113.22-2.26 9.87 9.87 0 012.21 13.54l-23.72 33.93a9.35 9.35 0 01-7.71 4.07zm-42.3 0a9.65 9.65 0 01-5.6-1.79 10.17 10.17 0 01-2.5-14l44.31-65.22a9.7 9.7 0 0113.69-2.54 10.16 10.16 0 012.5 14L71.26 117a9.73 9.73 0 01-8.09 4.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 202.66" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shipment.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M235.33 170.66h-13a10.68 10.68 0 110-21.35h12.33V115l-29.94-40.65-34.05.29v74.69H176a10.67 10.67 0 110 21.33h-16A10.68 10.68 0 01149.33 160V73.58A20.49 20.49 0 01170 53.31h35.12a20.88 20.88 0 0116.82 8.47l30.19 41.44A19.87 19.87 0 01256 115v35.4a20.48 20.48 0 01-20.67 20.26z"></path><path class="fill-primary" d="M160 170.66H89.81a10.68 10.68 0 010-21.35h59.52V20.59l-128.71.74.71 128.72 19.67-.72a10.67 10.67 0 110 21.34H20.62A20.66 20.66 0 010 150.05V20.62A20.64 20.64 0 0120.62 0h129.43a20.64 20.64 0 0120.62 20.62V160A10.67 10.67 0 01160 170.66z"></path><path class="fill-primary" d="M200 202.66a32 32 0 1132-32 32 32 0 01-32 32zm-136 0a32 32 0 1132-32 32 32 0 01-32 32z"></path><path class="fill-secondary" d="M41.47 89.33A9.29 9.29 0 0136 87.52 9.84 9.84 0 0133.76 74l23.71-33.94a9.35 9.35 0 0113.22-2.25 9.85 9.85 0 012.21 13.52L49.18 85.26a9.35 9.35 0 01-7.71 4.07zm64 32a9.29 9.29 0 01-5.5-1.81A9.86 9.86 0 0197.76 106l23.71-33.93a9.36 9.36 0 0113.22-2.26 9.87 9.87 0 012.21 13.54l-23.72 33.93a9.35 9.35 0 01-7.71 4.07zm-42.3 0a9.65 9.65 0 01-5.6-1.79 10.17 10.17 0 01-2.5-14l44.31-65.22a9.7 9.7 0 0113.69-2.54 10.16 10.16 0 012.5 14L71.26 117a9.73 9.73 0 01-8.09 4.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shipment</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shipment.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shipment.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shopping-bag.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M138.67 64H32A32.09 32.09 0 000 96v96a53.35 53.35 0 0053.33 53.33h64a53.52 53.52 0 0029.44-8.85l-14.29-13.65c-.64-.64-1.17-1.28-1.71-1.92a30.06 30.06 0 01-13.44 3.09h-64a32.09 32.09 0 01-32-32V96A10.7 10.7 0 0132 85.33h106.67A10.7 10.7 0 01149.34 96v21.55a11.46 11.46 0 012.68-.21h18.67V96a32.12 32.12 0 00-32-32z"></path><path class="fill-secondary" d="M205.33 256a18.44 18.44 0 01-13.3-5.58l-44.77-43a29.31 29.31 0 01-8.59-20.75V152A13.35 13.35 0 01152 138.67h34.67a29.13 29.13 0 0120.58 8.45l43.34 45.09a18.36 18.36 0 015.41 13.12 18.55 18.55 0 01-5.47 13.2l-32 32a18.5 18.5 0 01-13.2 5.47z"></path><path class="fill-primary" d="M117.33 117.33a10.68 10.68 0 01-10.67-10.67v-64a21.33 21.33 0 10-42.66 0v64a10.67 10.67 0 01-21.34 0v-64a42.67 42.67 0 0185.34 0v64a10.66 10.66 0 01-10.67 10.67z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shopping-bag.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M138.67 64H32A32.09 32.09 0 000 96v96a53.35 53.35 0 0053.33 53.33h64a53.52 53.52 0 0029.44-8.85l-14.29-13.65c-.64-.64-1.17-1.28-1.71-1.92a30.06 30.06 0 01-13.44 3.09h-64a32.09 32.09 0 01-32-32V96A10.7 10.7 0 0132 85.33h106.67A10.7 10.7 0 01149.34 96v21.55a11.46 11.46 0 012.68-.21h18.67V96a32.12 32.12 0 00-32-32z"></path><path class="fill-secondary" d="M205.33 256a18.44 18.44 0 01-13.3-5.58l-44.77-43a29.31 29.31 0 01-8.59-20.75V152A13.35 13.35 0 01152 138.67h34.67a29.13 29.13 0 0120.58 8.45l43.34 45.09a18.36 18.36 0 015.41 13.12 18.55 18.55 0 01-5.47 13.2l-32 32a18.5 18.5 0 01-13.2 5.47z"></path><path class="fill-primary" d="M117.33 117.33a10.68 10.68 0 01-10.67-10.67v-64a21.33 21.33 0 10-42.66 0v64a10.67 10.67 0 01-21.34 0v-64a42.67 42.67 0 0185.34 0v64a10.66 10.66 0 01-10.67 10.67z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shopping-bag</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shopping-bag.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shopping-bag.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 256.03" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shopping-basket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M250.58 51.23A24.14 24.14 0 00232 42.7H24a24.11 24.11 0 00-18.54 8.53A23.31 23.31 0 00.34 70.11l28.8 166.4A23.87 23.87 0 0052.82 256h150.4a23.88 23.88 0 0023.68-19.52l28.8-166.4a23.37 23.37 0 00-5.12-18.88zM85.34 202.69a10.67 10.67 0 01-21.34 0V160a10.67 10.67 0 0121.34 0zm53.35 0a10.68 10.68 0 01-21.35 0V160a10.68 10.68 0 0121.35 0zm53.33 0a10.68 10.68 0 01-21.35 0V160a10.68 10.68 0 0121.33 0z"></path><path class="fill-secondary" d="M74.69 85.36a10.51 10.51 0 01-3.38-.56 10.65 10.65 0 01-6.73-13.49l21.32-64a10.66 10.66 0 1120.23 6.74l-21.33 64a10.65 10.65 0 01-10.11 7.31zm106.65 0a10.67 10.67 0 01-10.11-7.3l-21.33-64a10.66 10.66 0 1120.23-6.73l21.33 64a10.65 10.65 0 01-6.74 13.48 10.77 10.77 0 01-3.38.55z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 256.03" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shopping-basket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M250.58 51.23A24.14 24.14 0 00232 42.7H24a24.11 24.11 0 00-18.54 8.53A23.31 23.31 0 00.34 70.11l28.8 166.4A23.87 23.87 0 0052.82 256h150.4a23.88 23.88 0 0023.68-19.52l28.8-166.4a23.37 23.37 0 00-5.12-18.88zM85.34 202.69a10.67 10.67 0 01-21.34 0V160a10.67 10.67 0 0121.34 0zm53.35 0a10.68 10.68 0 01-21.35 0V160a10.68 10.68 0 0121.35 0zm53.33 0a10.68 10.68 0 01-21.35 0V160a10.68 10.68 0 0121.33 0z"></path><path class="fill-secondary" d="M74.69 85.36a10.51 10.51 0 01-3.38-.56 10.65 10.65 0 01-6.73-13.49l21.32-64a10.66 10.66 0 1120.23 6.74l-21.33 64a10.65 10.65 0 01-10.11 7.31zm106.65 0a10.67 10.67 0 01-10.11-7.3l-21.33-64a10.66 10.66 0 1120.23-6.73l21.33 64a10.65 10.65 0 01-6.74 13.48 10.77 10.77 0 01-3.38.55z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shopping-basket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shopping-basket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shopping-basket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shopping-cart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M203.63 160H107.7a31 31 0 01-29.84-22.08L45.42 28.05a9.58 9.58 0 00-9.36-6.72H10.67a10.67 10.67 0 110-21.33h25.41a31 31 0 0129.84 22.08L72 42.67h163.14A21 21 0 01252 51.15a20.18 20.18 0 013.07 18.1l-22 69.84A31 31 0 01203.63 160zm31.51-96z"></path><path class="fill-secondary" d="M117.33 213.34A21.34 21.34 0 11138.66 192a21.35 21.35 0 01-21.33 21.34zm74.67 0A21.34 21.34 0 11213.33 192 21.35 21.35 0 01192 213.34z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/shopping-cart.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M203.63 160H107.7a31 31 0 01-29.84-22.08L45.42 28.05a9.58 9.58 0 00-9.36-6.72H10.67a10.67 10.67 0 110-21.33h25.41a31 31 0 0129.84 22.08L72 42.67h163.14A21 21 0 01252 51.15a20.18 20.18 0 013.07 18.1l-22 69.84A31 31 0 01203.63 160zm31.51-96z"></path><path class="fill-secondary" d="M117.33 213.34A21.34 21.34 0 11138.66 192a21.35 21.35 0 01-21.33 21.34zm74.67 0A21.34 21.34 0 11213.33 192 21.35 21.35 0 01192 213.34z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">shopping-cart</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shopping-cart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/shopping-cart.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160.75 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/smartphone.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M44.65 0a8.93 8.93 0 00-8.93 8.93v11.91a20.84 20.84 0 0020.84 20.84h47.63A20.84 20.84 0 00125 20.84V8.93A8.93 8.93 0 00116.09 0z"></path><path class="fill-primary" d="M0 32.74A32.74 32.74 0 0132.75 0H128a32.75 32.75 0 0132.75 32.74v190.52A32.75 32.75 0 01128 256H32.75A32.74 32.74 0 010 223.26zm32.75-14.88a14.88 14.88 0 00-14.89 14.88v190.52a14.88 14.88 0 0014.89 14.88H128a14.88 14.88 0 0014.88-14.88V32.74A14.88 14.88 0 00128 17.86z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 160.75 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/smartphone.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M44.65 0a8.93 8.93 0 00-8.93 8.93v11.91a20.84 20.84 0 0020.84 20.84h47.63A20.84 20.84 0 00125 20.84V8.93A8.93 8.93 0 00116.09 0z"></path><path class="fill-primary" d="M0 32.74A32.74 32.74 0 0132.75 0H128a32.75 32.75 0 0132.75 32.74v190.52A32.75 32.75 0 01128 256H32.75A32.74 32.74 0 010 223.26zm32.75-14.88a14.88 14.88 0 00-14.89 14.88v190.52a14.88 14.88 0 0014.89 14.88H128a14.88 14.88 0 0014.88-14.88V32.74A14.88 14.88 0 00128 17.86z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">smartphone</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/smartphone.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/smartphone.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/supermarket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M192 226.67h-53.33v-69.33a18.67 18.67 0 0118.67-18.67h16A18.67 18.67 0 01192 157.34v69.33z"></path><path class="fill-primary" d="M245.33 106.67H10.67a10.67 10.67 0 110-21.33h234.67a10.67 10.67 0 110 21.33z"></path><path class="fill-primary" d="M234.66 101.34a10.65 10.65 0 01-10.56-9.24l-8.2-61.49a10.73 10.73 0 00-10.57-9.27H50.69a10.72 10.72 0 00-10.58 9.27L31.92 92.1a10.67 10.67 0 01-21.15-2.82L19 27.79A32.08 32.08 0 0150.67 0h154.64A32.08 32.08 0 01237 27.79l8.2 61.49a10.66 10.66 0 01-9.17 12 12.81 12.81 0 01-1.39.08z"></path><path class="fill-primary" d="M69.34 101.34a11.52 11.52 0 01-1.42-.09 10.68 10.68 0 01-9.17-12l10.67-80a10.67 10.67 0 0121.16 2.82l-10.68 80a10.65 10.65 0 01-10.56 9.27zm58.66 0a10.67 10.67 0 01-10.67-10.67v-80a10.67 10.67 0 1121.34 0v80A10.67 10.67 0 01128 101.34zm58.66 0a10.65 10.65 0 01-10.56-9.24l-10.68-80a10.67 10.67 0 1121.16-2.82l10.67 80a10.66 10.66 0 01-9.17 12 13.83 13.83 0 01-1.42.06z"></path><path class="fill-primary" d="M202.67 234.67H53.34a32 32 0 01-32-32V96A10.64 10.64 0 0132 85.34h192A10.68 10.68 0 01234.67 96v106.69a32 32 0 01-32 31.98zm-160-128v96a10.68 10.68 0 0010.67 10.67h149.33a10.67 10.67 0 0010.67-10.67v-96z"></path><path class="fill-secondary" d="M98.67 192h-16A18.7 18.7 0 0164 173.34v-16a18.7 18.7 0 0118.67-18.67h16a18.69 18.69 0 0118.67 18.67v16A18.71 18.71 0 0198.67 192z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/supermarket.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M192 226.67h-53.33v-69.33a18.67 18.67 0 0118.67-18.67h16A18.67 18.67 0 01192 157.34v69.33z"></path><path class="fill-primary" d="M245.33 106.67H10.67a10.67 10.67 0 110-21.33h234.67a10.67 10.67 0 110 21.33z"></path><path class="fill-primary" d="M234.66 101.34a10.65 10.65 0 01-10.56-9.24l-8.2-61.49a10.73 10.73 0 00-10.57-9.27H50.69a10.72 10.72 0 00-10.58 9.27L31.92 92.1a10.67 10.67 0 01-21.15-2.82L19 27.79A32.08 32.08 0 0150.67 0h154.64A32.08 32.08 0 01237 27.79l8.2 61.49a10.66 10.66 0 01-9.17 12 12.81 12.81 0 01-1.39.08z"></path><path class="fill-primary" d="M69.34 101.34a11.52 11.52 0 01-1.42-.09 10.68 10.68 0 01-9.17-12l10.67-80a10.67 10.67 0 0121.16 2.82l-10.68 80a10.65 10.65 0 01-10.56 9.27zm58.66 0a10.67 10.67 0 01-10.67-10.67v-80a10.67 10.67 0 1121.34 0v80A10.67 10.67 0 01128 101.34zm58.66 0a10.65 10.65 0 01-10.56-9.24l-10.68-80a10.67 10.67 0 1121.16-2.82l10.67 80a10.66 10.66 0 01-9.17 12 13.83 13.83 0 01-1.42.06z"></path><path class="fill-primary" d="M202.67 234.67H53.34a32 32 0 01-32-32V96A10.64 10.64 0 0132 85.34h192A10.68 10.68 0 01234.67 96v106.69a32 32 0 01-32 31.98zm-160-128v96a10.68 10.68 0 0010.67 10.67h149.33a10.67 10.67 0 0010.67-10.67v-96z"></path><path class="fill-secondary" d="M98.67 192h-16A18.7 18.7 0 0164 173.34v-16a18.7 18.7 0 0118.67-18.67h16a18.69 18.69 0 0118.67 18.67v16A18.71 18.71 0 0198.67 192z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">supermarket</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/supermarket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/supermarket.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/synchronize.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M160 170.69H90.67a32 32 0 01-6.14-63.41 45.3 45.3 0 0182.33-10.59 37.32 37.32 0 01-6.86 74z"></path><path class="fill-secondary" d="M221 2.35l-20.41 20.42A126.7 126.7 0 00128 0 128 128 0 005.46 165a8 8 0 1015.32-4.61A112 112 0 01128 16a111.19 111.19 0 0161.14 18.2L173 50.35A8 8 0 00178.67 64h48a8 8 0 008-8V8A8 8 0 00221 2.35zM250.54 91a8 8 0 10-15.32 4.61A112 112 0 01128 240a111.06 111.06 0 01-61-18.15l16-16.22A8 8 0 0077.33 192h-48a8 8 0 00-8 8.08l.54 48a8 8 0 0013.68 5.53l20-20.25A126.85 126.85 0 00128 256 128 128 0 00250.54 91z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256.02" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/synchronize.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M160 170.69H90.67a32 32 0 01-6.14-63.41 45.3 45.3 0 0182.33-10.59 37.32 37.32 0 01-6.86 74z"></path><path class="fill-secondary" d="M221 2.35l-20.41 20.42A126.7 126.7 0 00128 0 128 128 0 005.46 165a8 8 0 1015.32-4.61A112 112 0 01128 16a111.19 111.19 0 0161.14 18.2L173 50.35A8 8 0 00178.67 64h48a8 8 0 008-8V8A8 8 0 00221 2.35zM250.54 91a8 8 0 10-15.32 4.61A112 112 0 01128 240a111.06 111.06 0 01-61-18.15l16-16.22A8 8 0 0077.33 192h-48a8 8 0 00-8 8.08l.54 48a8 8 0 0013.68 5.53l20-20.25A126.85 126.85 0 00128 256 128 128 0 00250.54 91z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">synchronize</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/synchronize.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/synchronize.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/team.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><circle class="fill-primary" cx="128" cy="26.67" r="26.67"></circle><circle class="fill-primary" cx="202.67" cy="176" r="26.67"></circle><circle class="fill-primary" cx="53.33" cy="176" r="26.67"></circle><path class="fill-primary" d="M173.33 106.67H82.66a8 8 0 01-8-8v-5.33A29.35 29.35 0 01104 64h48a29.35 29.35 0 0129.33 29.32v5.33a8 8 0 01-8 8.02zM248 256h-90.67a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48A29.36 29.36 0 01256 242.67V248a8 8 0 01-8 8zm-149.33 0H8a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48a29.37 29.37 0 0129.33 29.33V248a8 8 0 01-8 8z"></path><path class="fill-secondary" d="M29.33 136.13a8 8 0 01-8-8 107.1 107.1 0 0161.73-96.77 8 8 0 116.73 14.51 91 91 0 00-52.48 82.26 8 8 0 01-7.98 8zm197.34 0a8 8 0 01-8-8 91 91 0 00-52.48-82.26 8 8 0 116.74-14.51 107.09 107.09 0 0161.73 96.77 8 8 0 01-8 8zM128 234.8a105.08 105.08 0 01-11.15-.58 8 8 0 011.66-15.9 93.73 93.73 0 0019.6-.06 8 8 0 011.76 15.9 110.68 110.68 0 01-11.87.64z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/team.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><circle class="fill-primary" cx="128" cy="26.67" r="26.67"></circle><circle class="fill-primary" cx="202.67" cy="176" r="26.67"></circle><circle class="fill-primary" cx="53.33" cy="176" r="26.67"></circle><path class="fill-primary" d="M173.33 106.67H82.66a8 8 0 01-8-8v-5.33A29.35 29.35 0 01104 64h48a29.35 29.35 0 0129.33 29.32v5.33a8 8 0 01-8 8.02zM248 256h-90.67a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48A29.36 29.36 0 01256 242.67V248a8 8 0 01-8 8zm-149.33 0H8a8 8 0 01-8-8v-5.33a29.36 29.36 0 0129.33-29.33h48a29.37 29.37 0 0129.33 29.33V248a8 8 0 01-8 8z"></path><path class="fill-secondary" d="M29.33 136.13a8 8 0 01-8-8 107.1 107.1 0 0161.73-96.77 8 8 0 116.73 14.51 91 91 0 00-52.48 82.26 8 8 0 01-7.98 8zm197.34 0a8 8 0 01-8-8 91 91 0 00-52.48-82.26 8 8 0 116.74-14.51 107.09 107.09 0 0161.73 96.77 8 8 0 01-8 8zM128 234.8a105.08 105.08 0 01-11.15-.58 8 8 0 011.66-15.9 93.73 93.73 0 0019.6-.06 8 8 0 011.76 15.9 110.68 110.68 0 01-11.87.64z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">team</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/team.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/team.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.1 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/target.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M178.66 79.37L166.93 91.1a76.68 76.68 0 014.91 11.52 85.77 85.77 0 0114.93-1.28h1.39a93.65 93.65 0 00-9.5-21.97zM0 128a96.1 96.1 0 00109.65 95 82.93 82.93 0 01-5.65-15.42 67 67 0 01-8 .43A80 80 0 0196 48a79 79 0 0137 9.17l11.73-11.73A94.73 94.73 0 0096 32a96.14 96.14 0 00-96 96z"></path><path class="fill-secondary" d="M37.33 128A58.78 58.78 0 0096 186.68a47.26 47.26 0 005.44-.32A82.71 82.71 0 01103 170a37.32 37.32 0 01-7 .64 42.67 42.67 0 010-85.34 32.88 32.88 0 018 .84l12.91-12.91a57 57 0 00-20.91-4A58.81 58.81 0 0037.33 128z"></path><path class="fill-secondary" d="M96 106.68A21.33 21.33 0 10117.33 128 21.39 21.39 0 0096 106.68zm0 26.66a5.33 5.33 0 115.33-5.33 5.28 5.28 0 01-5.33 5.33z"></path><path class="fill-primary" d="M96.1 136a8 8 0 01-5.67-13.65L159.76 53a8 8 0 0111.31 11.31l-69.33 69.33A8 8 0 0196.1 136z"></path><path class="fill-primary" d="M194.77 64H168.1a8 8 0 01-8-8V29.34a8.08 8.08 0 012.33-5.67l21.33-21.33A8 8 0 01197.42 8v18.68h18.68a8 8 0 015.66 13.66l-21.33 21.33a8 8 0 01-5.66 2.33zm-8 53.34a69.34 69.34 0 1069.33 69.34 69.4 69.4 0 00-69.33-69.34zm29.87 56.11L182 210.78a8 8 0 01-11.09.64l-18.67-16a8 8 0 1110.41-12.15l12.84 11 29.44-31.69a8 8 0 0111.74 10.88z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.1 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/target.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M178.66 79.37L166.93 91.1a76.68 76.68 0 014.91 11.52 85.77 85.77 0 0114.93-1.28h1.39a93.65 93.65 0 00-9.5-21.97zM0 128a96.1 96.1 0 00109.65 95 82.93 82.93 0 01-5.65-15.42 67 67 0 01-8 .43A80 80 0 0196 48a79 79 0 0137 9.17l11.73-11.73A94.73 94.73 0 0096 32a96.14 96.14 0 00-96 96z"></path><path class="fill-secondary" d="M37.33 128A58.78 58.78 0 0096 186.68a47.26 47.26 0 005.44-.32A82.71 82.71 0 01103 170a37.32 37.32 0 01-7 .64 42.67 42.67 0 010-85.34 32.88 32.88 0 018 .84l12.91-12.91a57 57 0 00-20.91-4A58.81 58.81 0 0037.33 128z"></path><path class="fill-secondary" d="M96 106.68A21.33 21.33 0 10117.33 128 21.39 21.39 0 0096 106.68zm0 26.66a5.33 5.33 0 115.33-5.33 5.28 5.28 0 01-5.33 5.33z"></path><path class="fill-primary" d="M96.1 136a8 8 0 01-5.67-13.65L159.76 53a8 8 0 0111.31 11.31l-69.33 69.33A8 8 0 0196.1 136z"></path><path class="fill-primary" d="M194.77 64H168.1a8 8 0 01-8-8V29.34a8.08 8.08 0 012.33-5.67l21.33-21.33A8 8 0 01197.42 8v18.68h18.68a8 8 0 015.66 13.66l-21.33 21.33a8 8 0 01-5.66 2.33zm-8 53.34a69.34 69.34 0 1069.33 69.34 69.4 69.4 0 00-69.33-69.34zm29.87 56.11L182 210.78a8 8 0 01-11.09.64l-18.67-16a8 8 0 1110.41-12.15l12.84 11 29.44-31.69a8 8 0 0111.74 10.88z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">target</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/target.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/target.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/toggle.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M197.33 0H58.66a58.67 58.67 0 000 117.34h138.68A58.67 58.67 0 10197.33 0zM58.67 85.33a26.67 26.67 0 1126.67-26.66 26.71 26.71 0 01-26.67 26.66z"></path><path class="fill-primary" d="M197.33 138.67H58.66a58.67 58.67 0 000 117.33h138.68a58.67 58.67 0 100-117.33zm0 85.33A26.67 26.67 0 11224 197.33 26.7 26.7 0 01197.33 224z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/toggle.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M197.33 0H58.66a58.67 58.67 0 000 117.34h138.68A58.67 58.67 0 10197.33 0zM58.67 85.33a26.67 26.67 0 1126.67-26.66 26.71 26.71 0 01-26.67 26.66z"></path><path class="fill-primary" d="M197.33 138.67H58.66a58.67 58.67 0 000 117.33h138.68a58.67 58.67 0 100-117.33zm0 85.33A26.67 26.67 0 11224 197.33 26.7 26.7 0 01197.33 224z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">toggle</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/toggle.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/toggle.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 186.69 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/touchscreen.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M26.69 83.54V58.66a32 32 0 0164 0V80a31.67 31.67 0 013.25.37A47.94 47.94 0 1010.69 48a47.71 47.71 0 0016 35.54z"></path><path class="fill-primary" d="M170.69 117.33a16 16 0 00-16 16V136a2.68 2.68 0 01-5.35 0v-13.33a16 16 0 10-32 0V136a2.67 2.67 0 11-5.34 0v-24a16 16 0 00-32 0v24a2.67 2.67 0 11-5.34 0V58.67a16 16 0 00-32 0v96a5.32 5.32 0 01-5.33-5.33V128h-5.27C14.51 128 0 142.16 0 159.71.08 216.05 41.09 256 66.3 256h67.06a53.32 53.32 0 0053.33-53.33v-69.33a16 16 0 00-16-16z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 186.69 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/touchscreen.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M26.69 83.54V58.66a32 32 0 0164 0V80a31.67 31.67 0 013.25.37A47.94 47.94 0 1010.69 48a47.71 47.71 0 0016 35.54z"></path><path class="fill-primary" d="M170.69 117.33a16 16 0 00-16 16V136a2.68 2.68 0 01-5.35 0v-13.33a16 16 0 10-32 0V136a2.67 2.67 0 11-5.34 0v-24a16 16 0 00-32 0v24a2.67 2.67 0 11-5.34 0V58.67a16 16 0 00-32 0v96a5.32 5.32 0 01-5.33-5.33V128h-5.27C14.51 128 0 142.16 0 159.71.08 216.05 41.09 256 66.3 256h67.06a53.32 53.32 0 0053.33-53.33v-69.33a16 16 0 00-16-16z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">touchscreen</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/touchscreen.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/touchscreen.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.36" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/transfer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M55.82 115.15L2.5 64.47a8 8 0 010-11.6L55.82 2.2A8 8 0 0169.33 8v24H168a13.34 13.34 0 0113.33 13.33V72A13.35 13.35 0 01168 85.34H69.33v24a8 8 0 01-13.51 5.81z"></path><path class="fill-secondary" d="M186.67 205.35v-24H88A13.34 13.34 0 0174.67 168v-26.65A13.34 13.34 0 0188 128h98.67v-24a8 8 0 0113.51-5.81l53.32 50.67a8 8 0 010 11.6l-53.32 50.67a8 8 0 01-13.51-5.78z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 213.36" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/transfer.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M55.82 115.15L2.5 64.47a8 8 0 010-11.6L55.82 2.2A8 8 0 0169.33 8v24H168a13.34 13.34 0 0113.33 13.33V72A13.35 13.35 0 01168 85.34H69.33v24a8 8 0 01-13.51 5.81z"></path><path class="fill-secondary" d="M186.67 205.35v-24H88A13.34 13.34 0 0174.67 168v-26.65A13.34 13.34 0 0188 128h98.67v-24a8 8 0 0113.51-5.81l53.32 50.67a8 8 0 010 11.6l-53.32 50.67a8 8 0 01-13.51-5.78z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">transfer</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/transfer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/transfer.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.04 256.04" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/travel-insurance.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M248.57 7.48c-4.8-4.8-13.33-7.68-22.4-7.47-8.85.11-16.53 2.88-21 7.57L158.76 57a6 6 0 01-5.87 1.81L23.17 31.39a14.24 14.24 0 00-13.44 4 17.11 17.11 0 00-4.8 13.87 16.75 16.75 0 008.32 12.48l88.85 47a5.92 5.92 0 012.88 4.48 6.16 6.16 0 01-1.49 5l-53 57.07-27.2-11.95a16.71 16.71 0 00-18.56 3.52A15.82 15.82 0 006.55 191L40 215.61a12.29 12.29 0 012.56 2.67l22.83 31.25A16 16 0 0077.06 256h1.17a16.21 16.21 0 0011.31-4.69 16.67 16.67 0 003.52-18.56l-12-27.31 25.71-23.89c-.11-1.6-.11-3.31-.11-5v-42.8a29.36 29.36 0 0120-27.84l55.89-19a29.15 29.15 0 0119 0l6.29 2.13 40.64-38.19c4.69-4.48 7.47-12 7.57-21 .08-9.14-2.68-17.57-7.48-22.37z"></path><path class="fill-secondary" d="M250.6 126.17l-56-19a7.84 7.84 0 00-5.15 0l-56 19a8 8 0 00-5.43 7.57v42.86c0 52.32 58.39 77.73 60.88 78.8a8 8 0 006.26 0c2.49-1.05 60.88-26.48 60.88-78.8v-42.86a8 8 0 00-5.44-7.57zm-23.52 40.45L197.75 204a10.68 10.68 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19l10.23 8.69 22.46-28.58a10.67 10.67 0 1116.77 13.19z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.04 256.04" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/travel-insurance.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M248.57 7.48c-4.8-4.8-13.33-7.68-22.4-7.47-8.85.11-16.53 2.88-21 7.57L158.76 57a6 6 0 01-5.87 1.81L23.17 31.39a14.24 14.24 0 00-13.44 4 17.11 17.11 0 00-4.8 13.87 16.75 16.75 0 008.32 12.48l88.85 47a5.92 5.92 0 012.88 4.48 6.16 6.16 0 01-1.49 5l-53 57.07-27.2-11.95a16.71 16.71 0 00-18.56 3.52A15.82 15.82 0 006.55 191L40 215.61a12.29 12.29 0 012.56 2.67l22.83 31.25A16 16 0 0077.06 256h1.17a16.21 16.21 0 0011.31-4.69 16.67 16.67 0 003.52-18.56l-12-27.31 25.71-23.89c-.11-1.6-.11-3.31-.11-5v-42.8a29.36 29.36 0 0120-27.84l55.89-19a29.15 29.15 0 0119 0l6.29 2.13 40.64-38.19c4.69-4.48 7.47-12 7.57-21 .08-9.14-2.68-17.57-7.48-22.37z"></path><path class="fill-secondary" d="M250.6 126.17l-56-19a7.84 7.84 0 00-5.15 0l-56 19a8 8 0 00-5.43 7.57v42.86c0 52.32 58.39 77.73 60.88 78.8a8 8 0 006.26 0c2.49-1.05 60.88-26.48 60.88-78.8v-42.86a8 8 0 00-5.44-7.57zm-23.52 40.45L197.75 204a10.68 10.68 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19l10.23 8.69 22.46-28.58a10.67 10.67 0 1116.77 13.19z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">travel-insurance</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/travel-insurance.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/travel-insurance.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 244.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/tv-screen.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M0 68.47a32.74 32.74 0 0132.74-32.75h190.52A32.74 32.74 0 01256 68.47v142.88a32.74 32.74 0 01-32.74 32.74H32.74A32.74 32.74 0 010 211.35zm32.74-14.89a14.88 14.88 0 00-14.88 14.89v142.88a14.88 14.88 0 0014.88 14.88h190.52a14.88 14.88 0 0014.88-14.88V68.47a14.88 14.88 0 00-14.88-14.89z"></path><path class="fill-primary" d="M26.43 2.62a8.93 8.93 0 0112.63 0L68.47 32l29.4-29.4a8.93 8.93 0 0112.63 12.64L74.78 51a8.94 8.94 0 01-12.63 0L26.43 15.24a8.91 8.91 0 010-12.62z"></path><path class="fill-secondary" d="M109.76 85.31a8.92 8.92 0 00-14.5 7v95.25a8.93 8.93 0 0014.5 7l59.54-47.63a8.94 8.94 0 000-13.95z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 244.09" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/tv-screen.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M0 68.47a32.74 32.74 0 0132.74-32.75h190.52A32.74 32.74 0 01256 68.47v142.88a32.74 32.74 0 01-32.74 32.74H32.74A32.74 32.74 0 010 211.35zm32.74-14.89a14.88 14.88 0 00-14.88 14.89v142.88a14.88 14.88 0 0014.88 14.88h190.52a14.88 14.88 0 0014.88-14.88V68.47a14.88 14.88 0 00-14.88-14.89z"></path><path class="fill-primary" d="M26.43 2.62a8.93 8.93 0 0112.63 0L68.47 32l29.4-29.4a8.93 8.93 0 0112.63 12.64L74.78 51a8.94 8.94 0 01-12.63 0L26.43 15.24a8.91 8.91 0 010-12.62z"></path><path class="fill-secondary" d="M109.76 85.31a8.92 8.92 0 00-14.5 7v95.25a8.93 8.93 0 0014.5 7l59.54-47.63a8.94 8.94 0 000-13.95z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">tv-screen</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/tv-screen.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/tv-screen.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/verify.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M186.67 117.33A69.34 69.34 0 10256 186.68a69.43 69.43 0 00-69.33-69.35zm37.34 55L186.68 215a10.65 10.65 0 01-7.68 3.63h-.35a10.67 10.67 0 01-7.53-3.12l-21.33-21.33a10.67 10.67 0 0115.09-15.09l13.26 13.27L208 158.3a10.67 10.67 0 1116 14.07z"></path><path class="fill-primary" d="M177.92 32.32L92.58.32a5.88 5.88 0 00-3.84 0l-85.35 32a5.36 5.36 0 00-3.39 5v68.59c0 97.28 88.64 117.76 89.5 118a6.28 6.28 0 002.34 0 73.48 73.48 0 0010.77-3.41A89.34 89.34 0 0196 186.68a90.78 90.78 0 0185.34-90.56V37.35a5.38 5.38 0 00-3.42-5z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/verify.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M186.67 117.33A69.34 69.34 0 10256 186.68a69.43 69.43 0 00-69.33-69.35zm37.34 55L186.68 215a10.65 10.65 0 01-7.68 3.63h-.35a10.67 10.67 0 01-7.53-3.12l-21.33-21.33a10.67 10.67 0 0115.09-15.09l13.26 13.27L208 158.3a10.67 10.67 0 1116 14.07z"></path><path class="fill-primary" d="M177.92 32.32L92.58.32a5.88 5.88 0 00-3.84 0l-85.35 32a5.36 5.36 0 00-3.39 5v68.59c0 97.28 88.64 117.76 89.5 118a6.28 6.28 0 002.34 0 73.48 73.48 0 0010.77-3.41A89.34 89.34 0 0196 186.68a90.78 90.78 0 0185.34-90.56V37.35a5.38 5.38 0 00-3.42-5z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">verify</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/verify.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/verify.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 202.68" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/video-chat.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M245.33 181.33H10.67a10.68 10.68 0 000 21.35h234.67a10.68 10.68 0 100-21.35z"></path><path class="fill-primary" d="M112 66.66a28.3 28.3 0 001.07 8h-70.4v106.67H21.33V74.66a21.39 21.39 0 0121.33-21.33H112zm122.67 30.51v84.16h-21.33v-81a33.47 33.47 0 0014.93-7.79l5.33 4a3.67 3.67 0 001.07.64z"></path><circle class="fill-primary" cx="117.33" cy="117.33" r="21.33"></circle><path class="fill-primary" d="M160 178.66v2.67H74.67v-2.67A29.32 29.32 0 01104 149.33h26.67A29.32 29.32 0 01160 178.66z"></path><path class="fill-secondary" d="M248 85.33a8 8 0 01-4.8-1.6L223.82 69.2a18.67 18.67 0 01-18.49 16.13h-58.67A18.68 18.68 0 01128 66.66V16c0-7.37 4.9-16 18.67-16h58.67A18.69 18.69 0 01224 17.62l18.9-15.76A8 8 0 01256 8v69.33a8 8 0 01-4.42 7.15 7.82 7.82 0 01-3.58.85z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 202.68" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/video-chat.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M245.33 181.33H10.67a10.68 10.68 0 000 21.35h234.67a10.68 10.68 0 100-21.35z"></path><path class="fill-primary" d="M112 66.66a28.3 28.3 0 001.07 8h-70.4v106.67H21.33V74.66a21.39 21.39 0 0121.33-21.33H112zm122.67 30.51v84.16h-21.33v-81a33.47 33.47 0 0014.93-7.79l5.33 4a3.67 3.67 0 001.07.64z"></path><circle class="fill-primary" cx="117.33" cy="117.33" r="21.33"></circle><path class="fill-primary" d="M160 178.66v2.67H74.67v-2.67A29.32 29.32 0 01104 149.33h26.67A29.32 29.32 0 01160 178.66z"></path><path class="fill-secondary" d="M248 85.33a8 8 0 01-4.8-1.6L223.82 69.2a18.67 18.67 0 01-18.49 16.13h-58.67A18.68 18.68 0 01128 66.66V16c0-7.37 4.9-16 18.67-16h58.67A18.69 18.69 0 01224 17.62l18.9-15.76A8 8 0 01256 8v69.33a8 8 0 01-4.42 7.15 7.82 7.82 0 01-3.58.85z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">video-chat</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/video-chat.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/video-chat.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/video-player.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M237.34 0H18.66A18.69 18.69 0 000 18.67v144a18.69 18.69 0 0018.67 18.67h81.7c-1.25 5.35-4.58 14-13.46 22.9a5.33 5.33 0 003.78 9.1h74.67a5.33 5.33 0 003.78-9.1c-8.87-8.86-12.28-17.54-13.6-22.9h81.82A18.68 18.68 0 00256 162.67v-144A18.73 18.73 0 00237.34 0zm-2.67 138.67H21.33V21.34h213.34z"></path><path class="fill-secondary" d="M114.67 117.34a8 8 0 01-8-8V50.67a8 8 0 0112.16-6.83l48 29.33a8 8 0 010 13.66l-48 29.33a8 8 0 01-4.16 1.18z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.03 213.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/video-player.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M237.34 0H18.66A18.69 18.69 0 000 18.67v144a18.69 18.69 0 0018.67 18.67h81.7c-1.25 5.35-4.58 14-13.46 22.9a5.33 5.33 0 003.78 9.1h74.67a5.33 5.33 0 003.78-9.1c-8.87-8.86-12.28-17.54-13.6-22.9h81.82A18.68 18.68 0 00256 162.67v-144A18.73 18.73 0 00237.34 0zm-2.67 138.67H21.33V21.34h213.34z"></path><path class="fill-secondary" d="M114.67 117.34a8 8 0 01-8-8V50.67a8 8 0 0112.16-6.83l48 29.33a8 8 0 010 13.66l-48 29.33a8 8 0 01-4.16 1.18z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">video-player</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/video-player.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/video-player.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/videocall.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-secondary" d="M256 21.33v160a21.39 21.39 0 01-21.33 21.33H186a55.9 55.9 0 00-55.36-48H128V149a63.52 63.52 0 0016-22.08v27.73h96V29.33A13.33 13.33 0 00226.67 16h-69.33A13.33 13.33 0 00144 29.33v46.72a62.68 62.68 0 00-16-22.19V21.33A21.39 21.39 0 01149.33 0h85.33A21.4 21.4 0 01256 21.33z"></path><path class="fill-secondary" d="M192 85.33a16 16 0 1116-16 16 16 0 01-16 16zM216 128h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-primary" d="M162.67 256H8a8 8 0 01-8-8v-37.33a40 40 0 0140-40h90.67a40 40 0 0140 40V248a8 8 0 01-8 8zM38.4 91.73a1.8 1.8 0 01.11-.75 48 48 0 0193.76.32c0 .11.11.32.11.43s-.32.11-.43.11C114 96.64 102.4 77.12 102 76.27a5.32 5.32 0 00-3.84-2.56 5.42 5.42 0 00-4.48 1.39c-22.62 21-52.81 17-55.26 16.63z"></path><path class="fill-primary" d="M126.08 103.25c-14.4 0-24.64-10-29.76-16.43-24.32 19.08-53 16.32-58.88 15.56a21.89 21.89 0 00.21 4.6 48 48 0 0095.36-.32 18.89 18.89 0 00.21-4.28 26.93 26.93 0 01-7.14.87z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/videocall.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-secondary" d="M256 21.33v160a21.39 21.39 0 01-21.33 21.33H186a55.9 55.9 0 00-55.36-48H128V149a63.52 63.52 0 0016-22.08v27.73h96V29.33A13.33 13.33 0 00226.67 16h-69.33A13.33 13.33 0 00144 29.33v46.72a62.68 62.68 0 00-16-22.19V21.33A21.39 21.39 0 01149.33 0h85.33A21.4 21.4 0 01256 21.33z"></path><path class="fill-secondary" d="M192 85.33a16 16 0 1116-16 16 16 0 01-16 16zM216 128h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-primary" d="M162.67 256H8a8 8 0 01-8-8v-37.33a40 40 0 0140-40h90.67a40 40 0 0140 40V248a8 8 0 01-8 8zM38.4 91.73a1.8 1.8 0 01.11-.75 48 48 0 0193.76.32c0 .11.11.32.11.43s-.32.11-.43.11C114 96.64 102.4 77.12 102 76.27a5.32 5.32 0 00-3.84-2.56 5.42 5.42 0 00-4.48 1.39c-22.62 21-52.81 17-55.26 16.63z"></path><path class="fill-primary" d="M126.08 103.25c-14.4 0-24.64-10-29.76-16.43-24.32 19.08-53 16.32-58.88 15.56a21.89 21.89 0 00.21 4.6 48 48 0 0095.36-.32 18.89 18.89 0 00.21-4.28 26.93 26.93 0 01-7.14.87z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">videocall</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/videocall.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/videocall.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/videocall-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><g data-name="Layer 2"><path class="fill-primary" d="M170.67 37.33V32a32.09 32.09 0 00-32-32H32A32.09 32.09 0 000 32v192a32.09 32.09 0 0032 32h106.67a32.09 32.09 0 0032-32v-69.33h-21.33v58.67h-128V32A10.7 10.7 0 0132 21.33h106.69A10.7 10.7 0 01149.36 32v5.33z"></path><circle class="fill-primary" cx="85.33" cy="149.33" r="21.33"></circle><path class="fill-primary" d="M128 210.67v2.67H42.67v-2.67A29.32 29.32 0 0172 181.34h26.67A29.3 29.3 0 01128 210.67z"></path><path class="fill-secondary" d="M248 138.67a8 8 0 01-4.8-1.6l-19.38-14.53a18.67 18.67 0 01-18.49 16.13h-58.67A18.69 18.69 0 01128 120V69.33c0-7.38 4.9-16 18.67-16h58.67A18.69 18.69 0 01224 70.94l18.9-15.76a8 8 0 0113.1 6.15v69.33a8 8 0 01-8 8z"></path></g></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/videocall-2.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><g data-name="Layer 2"><path class="fill-primary" d="M170.67 37.33V32a32.09 32.09 0 00-32-32H32A32.09 32.09 0 000 32v192a32.09 32.09 0 0032 32h106.67a32.09 32.09 0 0032-32v-69.33h-21.33v58.67h-128V32A10.7 10.7 0 0132 21.33h106.69A10.7 10.7 0 01149.36 32v5.33z"></path><circle class="fill-primary" cx="85.33" cy="149.33" r="21.33"></circle><path class="fill-primary" d="M128 210.67v2.67H42.67v-2.67A29.32 29.32 0 0172 181.34h26.67A29.3 29.3 0 01128 210.67z"></path><path class="fill-secondary" d="M248 138.67a8 8 0 01-4.8-1.6l-19.38-14.53a18.67 18.67 0 01-18.49 16.13h-58.67A18.69 18.69 0 01128 120V69.33c0-7.38 4.9-16 18.67-16h58.67A18.69 18.69 0 01224 70.94l18.9-15.76a8 8 0 0113.1 6.15v69.33a8 8 0 01-8 8z"></path></g></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">videocall-2</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/videocall-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/videocall-2.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/wallet.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M184.21 42.75L161.57 4a8 8 0 00-4.91-3.76 8.1 8.1 0 00-6.12.9L81.31 42.66z"></path><path class="fill-primary" d="M32 53.33A10.67 10.67 0 0132 32h36l35.63-21.33H32A32 32 0 00.53 37.33 10.9 10.9 0 000 40v162.67a32.09 32.09 0 0032 32h181.33a21.39 21.39 0 0021.33-21.32V192H208a48 48 0 110-96h26.67V74.69a21.39 21.39 0 00-21.33-21.33H32zM202.67 32a21.3 21.3 0 00-18.45-21.12l18.45 31.79z"></path><path class="fill-secondary" d="M248 112h-40a32 32 0 000 64h40a8 8 0 008-8v-48a8 8 0 00-8-8zm-40 42.66A10.67 10.67 0 11218.67 144 10.68 10.68 0 01208 154.66z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/wallet.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M184.21 42.75L161.57 4a8 8 0 00-4.91-3.76 8.1 8.1 0 00-6.12.9L81.31 42.66z"></path><path class="fill-primary" d="M32 53.33A10.67 10.67 0 0132 32h36l35.63-21.33H32A32 32 0 00.53 37.33 10.9 10.9 0 000 40v162.67a32.09 32.09 0 0032 32h181.33a21.39 21.39 0 0021.33-21.32V192H208a48 48 0 110-96h26.67V74.69a21.39 21.39 0 00-21.33-21.33H32zM202.67 32a21.3 21.3 0 00-18.45-21.12l18.45 31.79z"></path><path class="fill-secondary" d="M248 112h-40a32 32 0 000 64h40a8 8 0 008-8v-48a8 8 0 00-8-8zm-40 42.66A10.67 10.67 0 11218.67 144 10.68 10.68 0 01208 154.66z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">wallet</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/wallet.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/wallet.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/web-browser.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-primary" d="M186.67 74.67h-160A26.67 26.67 0 000 101.33v128A26.67 26.67 0 0026.66 256h160a26.67 26.67 0 0026.67-26.67v-128a26.66 26.66 0 00-26.66-26.66zm-5.34 160H32A10.67 10.67 0 0121.33 224v-96H192v96a10.67 10.67 0 01-10.67 10.67z"></path><path class="fill-secondary" d="M229.34 0h-160a26.68 26.68 0 00-26.68 26.67v26.67h192V180.8A26.67 26.67 0 00256 154.67v-128A26.67 26.67 0 00229.34 0z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/web-browser.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-primary" d="M186.67 74.67h-160A26.67 26.67 0 000 101.33v128A26.67 26.67 0 0026.66 256h160a26.67 26.67 0 0026.67-26.67v-128a26.66 26.66 0 00-26.66-26.66zm-5.34 160H32A10.67 10.67 0 0121.33 224v-96H192v96a10.67 10.67 0 01-10.67 10.67z"></path><path class="fill-secondary" d="M229.34 0h-160a26.68 26.68 0 00-26.68 26.67v26.67h192V180.8A26.67 26.67 0 00256 154.67v-128A26.67 26.67 0 00229.34 0z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">web-browser</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/web-browser.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/web-browser.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
                 <li class="!text-center xl:w-1/5 lg:w-1/5 md:w-4/12 w-6/12 flex-[0_0_auto] px-[15px] max-w-full !mt-[30px]">
                   <div class="card">
                     <div class="card-body p-[.5rem_.2rem_1rem] pt-[1rem] flex-[1_1_auto]">
-                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/web-programming.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#3f78e0] "><path class="fill-secondary" d="M162.66 160.33a8 8 0 01-6.07-13.2l11.54-13.46-11.54-13.45a8 8 0 0112.15-10.42l16 18.67a8 8 0 010 10.42l-16 18.67a8.07 8.07 0 01-6.08 2.77zm-69.32 0a8 8 0 01-6.08-2.79l-16-18.67a8 8 0 010-10.41l16-18.68a8 8 0 0112.15 10.42l-11.54 13.46 11.54 13.45a8 8 0 01-6.07 13.22zm24.87 15.79a8 8 0 01-6-9.6l16-69.33a8 8 0 1115.6 3.6l-16 69.33a8 8 0 01-9.6 6z"></path><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h192a32.09 32.09 0 0032-32V32a32.09 32.09 0 00-32-32zm10.67 202.66A10.7 10.7 0 01224 213.33H32a10.7 10.7 0 01-10.67-10.67V53.33h213.33v149.33z"></path></svg>
+                      <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/web-programming.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem] inline-block  solid-mono  text-primary !text-[#e31e24] "><path class="fill-secondary" d="M162.66 160.33a8 8 0 01-6.07-13.2l11.54-13.46-11.54-13.45a8 8 0 0112.15-10.42l16 18.67a8 8 0 010 10.42l-16 18.67a8.07 8.07 0 01-6.08 2.77zm-69.32 0a8 8 0 01-6.08-2.79l-16-18.67a8 8 0 010-10.41l16-18.68a8 8 0 0112.15 10.42l-11.54 13.46 11.54 13.45a8 8 0 01-6.07 13.22zm24.87 15.79a8 8 0 01-6-9.6l16-69.33a8 8 0 1115.6 3.6l-16 69.33a8 8 0 01-9.6 6z"></path><path class="fill-primary" d="M224 0H32A32.09 32.09 0 000 32v170.67a32.09 32.09 0 0032 32h192a32.09 32.09 0 0032-32V32a32.09 32.09 0 00-32-32zm10.67 202.66A10.7 10.7 0 01224 213.33H32a10.7 10.7 0 01-10.67-10.67V53.33h213.33v149.33z"></path></svg>
                       <span class=" block text-[#aab0bc] text-[0.7rem] m-0">web-programming</span>
                     </div>
-                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/web-programming.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#3f78e0] &quot; alt=&quot;&quot; />">Copy</a></div>
+                    <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link text-[#60697b] btn-copy-icon" data-clipboard-text="<img src=_/assets/img/icons/solid/web-programming.html class=&quot;svg-inject icon-svg icon-svg-xs solid-mono  text-primary !text-[#e31e24] &quot; alt=&quot;&quot; />">Copy</a></div>
                   </div>
                 </li>
               </ul>
@@ -6276,9 +6276,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/illustrations.html b/public/docs/styleguide/illustrations.html
index 7ee2b15..02aebd9 100644
--- a/public/docs/styleguide/illustrations.html
+++ b/public/docs/styleguide/illustrations.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,13 +592,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-font.html'>Font Icons</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-font.html'>Font Icons</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='backgrounds.html'>Backgrounds</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='misc.html'>Misc</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='backgrounds.html'>Backgrounds</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,13 +647,13 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Set 1</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Set 2</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Set 3</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Set 4</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Set 5</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Set 6</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-7">Set 7</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Set 1</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Set 2</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Set 3</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Set 4</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Set 5</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Set 6</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-7">Set 7</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -669,7 +669,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i1.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/growing-up-landing-page-design_4238115.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/growing-up-landing-page-design_4238115.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i1.html srcset=&quot;./assets/img/illustrations/i1@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -678,7 +678,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i2.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/startup-landing-page_4237363.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/startup-landing-page_4237363.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i2.html srcset=&quot;./assets/img/illustrations/i2@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -687,7 +687,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i3.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/teamwork-landing-page_4238239.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/teamwork-landing-page_4238239.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i3.html srcset=&quot;./assets/img/illustrations/i3@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -696,7 +696,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i4.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/about-us-landing-page-design_4238455.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/about-us-landing-page-design_4238455.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i4.html srcset=&quot;./assets/img/illustrations/i4@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -705,7 +705,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i5.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/data-protection-landing-page-design_4237696.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/data-protection-landing-page-design_4237696.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i5.html srcset=&quot;./assets/img/illustrations/i5@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -714,7 +714,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i6.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/digital-marketing-landing-page-web-design_4237912.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/digital-marketing-landing-page-web-design_4237912.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i6.html srcset=&quot;./assets/img/illustrations/i6@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -723,7 +723,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i7.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/online-shopping-landing-page_4237971.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/online-shopping-landing-page_4237971.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i7.html srcset=&quot;./assets/img/illustrations/i7@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -732,7 +732,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i8.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/seo-optimization-landing-page-design_4237777.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/seo-optimization-landing-page-design_4237777.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i8.html srcset=&quot;./assets/img/illustrations/i8@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -746,7 +746,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i9.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/app-development-landing-page_3103245.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/app-development-landing-page_3103245.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i9.html srcset=&quot;./assets/img/illustrations/i9@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -755,7 +755,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i10.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/web-design-landing-page_3103246.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/web-design-landing-page_3103246.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i10.html srcset=&quot;./assets/img/illustrations/i10@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -764,7 +764,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i11.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/data-analysis-landing-page_3103247.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/data-analysis-landing-page_3103247.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i11.html srcset=&quot;./assets/img/illustrations/i11@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -773,7 +773,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i12.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/teamwork-design-landing-page_3103248.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/teamwork-design-landing-page_3103248.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i12.html srcset=&quot;./assets/img/illustrations/i12@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -782,7 +782,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i13.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/time-management-landing-page_3103250.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/time-management-landing-page_3103250.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i13.html srcset=&quot;./assets/img/illustrations/i13@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -791,7 +791,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i14.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/workspace-design-landing-page_3103252.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/workspace-design-landing-page_3103252.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i14.html srcset=&quot;./assets/img/illustrations/i14@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -800,7 +800,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i15.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/online-shopping-landing-page_3103253.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/online-shopping-landing-page_3103253.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i15.html srcset=&quot;./assets/img/illustrations/i15@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -809,7 +809,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i16.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/responsive-design-landing-page_3103254.htm#page=56&query=landing+page&position=41" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/responsive-design-landing-page_3103254.htm#page=56&query=landing+page&position=41" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i16.html srcset=&quot;./assets/img/illustrations/i16@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -818,7 +818,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i17.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/creative-process-landing-page_4405718.htm#page=9&query=landing+page&position=37" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/creative-process-landing-page_4405718.htm#page=9&query=landing+page&position=37" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i17.html srcset=&quot;./assets/img/illustrations/i17@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -832,7 +832,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i18.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/3d-printing-technology-web-banner-landing-page-set_12447938.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/3d-printing-technology-web-banner-landing-page-set_12447938.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i18.html srcset=&quot;./assets/img/illustrations/i18@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -841,7 +841,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i19.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/advert-designer-illustrator-web-banner-landing-page_12447940.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/advert-designer-illustrator-web-banner-landing-page_12447940.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i19.html srcset=&quot;./assets/img/illustrations/i19@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -850,7 +850,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i20.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/cyber-web-security-specialist-web-banner-landing-page-set_12447948.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/cyber-web-security-specialist-web-banner-landing-page-set_12447948.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i20.html srcset=&quot;./assets/img/illustrations/i20@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -859,7 +859,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i21.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/graphic-designer-digital-illustrator-web-banner-landing-page-set_12447958.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/graphic-designer-digital-illustrator-web-banner-landing-page-set_12447958.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i21.html srcset=&quot;./assets/img/illustrations/i21@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -868,7 +868,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i22.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/graphic-designer-digital-illustrator-web-banner-landing-page-set_12447958.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/graphic-designer-digital-illustrator-web-banner-landing-page-set_12447958.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i22.html srcset=&quot;./assets/img/illustrations/i22@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -877,7 +877,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i23.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/system-administrator-web-banner-landing-page-set_12447983.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/system-administrator-web-banner-landing-page-set_12447983.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i23.html srcset=&quot;./assets/img/illustrations/i23@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -886,7 +886,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i24.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/web-design-web-layout-landing-page-set-presenting-content-web-pages-website-layout-composition-color-development-idea-computer-technology_13137171.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/web-design-web-layout-landing-page-set-presenting-content-web-pages-website-layout-composition-color-development-idea-computer-technology_13137171.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i24.html srcset=&quot;./assets/img/illustrations/i24@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -895,7 +895,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i25.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/web-programming-web-layout-landing-page-set-coding-testing-writing-program-website-using-internet-different-software-website-development_13137173.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/web-programming-web-layout-landing-page-set-coding-testing-writing-program-website-using-internet-different-software-website-development_13137173.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i25.html srcset=&quot;./assets/img/illustrations/i25@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -904,7 +904,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i26.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/mobile-app-development-web-layout-landing-page-set-modern-technology-smartphone-interface-design-application-building-programming_13137153.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/mobile-app-development-web-layout-landing-page-set-modern-technology-smartphone-interface-design-application-building-programming_13137153.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i26.html srcset=&quot;./assets/img/illustrations/i26@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -913,7 +913,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i27.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/director-web-banner-landing-page_12447955.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/director-web-banner-landing-page_12447955.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i27.html srcset=&quot;./assets/img/illustrations/i27@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -927,7 +927,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ui1.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/mobile-phone-interface-3d-concepts-landing-page_6721408.htm#page=1&query=Seo%20company&position=36&from_view=keyword" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/mobile-phone-interface-3d-concepts-landing-page_6721408.htm#page=1&query=Seo%20company&position=36&from_view=keyword" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ui1.html srcset=&quot;./assets/img/illustrations/ui1@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -936,7 +936,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ui2.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/digital-screens-plants-3d-concepts-landing-page_6721403.htm#page=1&query=3d&position=9&from_view=search" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/digital-screens-plants-3d-concepts-landing-page_6721403.htm#page=1&query=3d&position=9&from_view=search" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ui2.html srcset=&quot;./assets/img/illustrations/ui2@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -945,7 +945,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ui3.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/online-purchases-from-homr-3d-concepts-landing-page_6721402.htm#page=1&query=3d&position=48&from_view=search" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/online-purchases-from-homr-3d-concepts-landing-page_6721402.htm#page=1&query=3d&position=48&from_view=search" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ui3.html srcset=&quot;./assets/img/illustrations/ui3@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -954,7 +954,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ui4.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/free-vector/social-online-interaction-3d-concepts-landing-page_6721405.htm#page=1&position=9&from_view=user" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/free-vector/social-online-interaction-3d-concepts-landing-page_6721405.htm#page=1&position=9&from_view=user" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ui4.html srcset=&quot;./assets/img/illustrations/ui4@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -963,7 +963,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ui5.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-vector/landing-page-template-with-easy-shipping_12392824.htm#page=1&position=21&from_view=user" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-vector/landing-page-template-with-easy-shipping_12392824.htm#page=1&position=21&from_view=user" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ui5.html srcset=&quot;./assets/img/illustrations/ui5@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -977,7 +977,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d1.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3-email-campaign-with-mobile-phone_15751106.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3-email-campaign-with-mobile-phone_15751106.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d1.html srcset=&quot;./assets/img/illustrations/3d1@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -986,7 +986,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d2.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/great-idea-3d-illustration-concept_14514386.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/great-idea-3d-illustration-concept_14514386.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d2.html srcset=&quot;./assets/img/illustrations/3d2@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -995,7 +995,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d3.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-email-campaign-with-laptop_15751105.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-email-campaign-with-laptop_15751105.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d3.html srcset=&quot;./assets/img/illustrations/3d3@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1004,7 +1004,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d4.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-illustration-concept-man-looking-ideas_14514382.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-illustration-concept-man-looking-ideas_14514382.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d4.html srcset=&quot;./assets/img/illustrations/3d4@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1013,7 +1013,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d5.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-new-employee-interview-with-applicants-identity_16069636.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-new-employee-interview-with-applicants-identity_16069636.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d5.html srcset=&quot;./assets/img/illustrations/3d5@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1022,7 +1022,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d6.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-online-connection-with-male-character_15751113.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-online-connection-with-male-character_15751113.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d6.html srcset=&quot;./assets/img/illustrations/3d6@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1031,7 +1031,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d7.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-online-shopping-illustration_16523091.htm#page=1&query=online%20shopping%20illustration&position=7&from_view=search" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-online-shopping-illustration_16523091.htm#page=1&query=online%20shopping%20illustration&position=7&from_view=search" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d7.html srcset=&quot;./assets/img/illustrations/3d7@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1040,7 +1040,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d8.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-working-time-with-male-female-characters_16644661.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-working-time-with-male-female-characters_16644661.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d8.html srcset=&quot;./assets/img/illustrations/3d8@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1049,7 +1049,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d9.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-startup-life-with-man-standing-rocket_16644633.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-startup-life-with-man-standing-rocket_16644633.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d9.html srcset=&quot;./assets/img/illustrations/3d9@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1058,7 +1058,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d10.png" alt="image"></figure>
-                    <a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank" href="https://www.freepik.com/premium-psd/3d-hosting-with-male-character-using-laptop_16428910.htm#page=1&position=21&from_view=detail#&position=21&from_view=detail">Resource</a>
+                    <a class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank" href="https://www.freepik.com/premium-psd/3d-hosting-with-male-character-using-laptop_16428910.htm#page=1&position=21&from_view=detail#&position=21&from_view=detail">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d10.html srcset=&quot;./assets/img/illustrations/3d10@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1067,7 +1067,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d11.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-startup-life-with-man-holding-notes_16644607.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-startup-life-with-man-holding-notes_16644607.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d11.html srcset=&quot;./assets/img/illustrations/3d11@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1076,7 +1076,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/3d12.png" alt="image"></figure>
-                    <a href="https://www.freepik.com/premium-psd/3d-think-illustration_14902775.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.freepik.com/premium-psd/3d-think-illustration_14902775.htm" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/3d12.html srcset=&quot;./assets/img/illustrations/3d12@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1090,7 +1090,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i28.png" alt="image"></figure>
-                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i28.html srcset=&quot;./assets/img/illustrations/i28@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1099,7 +1099,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i29.png" alt="image"></figure>
-                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i29.html srcset=&quot;./assets/img/illustrations/i29@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1108,7 +1108,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i30.png" alt="image"></figure>
-                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i30.html srcset=&quot;./assets/img/illustrations/i30@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1117,7 +1117,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i31.png" alt="image"></figure>
-                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i31.html srcset=&quot;./assets/img/illustrations/i31@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1126,7 +1126,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/i32.png" alt="image"></figure>
-                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://iconpark.oceanengine.com/illustrations/9" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/i32.html srcset=&quot;./assets/img/illustrations/i32@2x.png 2x&quot; alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1140,7 +1140,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 pb-6 flex  flex-col justify-end items-center">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni1.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni1.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1149,7 +1149,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni2.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni2.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1158,7 +1158,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni3.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni3.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1167,7 +1167,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni4.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni4.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1176,7 +1176,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni5.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni5.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1185,7 +1185,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni6.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni6.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1194,7 +1194,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni7.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni7.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1203,7 +1203,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni8.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni8.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1212,7 +1212,7 @@
                 <div class="card !h-full">
                   <div class="card-body !p-10 !pb-6">
                     <figure class="m-0 p-0"><img class="max-w-full h-auto" src="../../assets/img/illustrations/ni9.png" alt="image"></figure>
-                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#3f78e0] hover:after:!text-[#3f78e0] !mt-6" target="_blank">Resource</a>
+                    <a href="https://www.figma.com/community/file/1000311109311441524" class="external !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom hover:!text-[#e31e24] hover:after:!text-[#e31e24] !mt-6" target="_blank">Resource</a>
                   </div>
                   <div class="card-footer !relative cursor-pointer text-[0.7rem] !p-[.5rem_.2rem]"><a class="stretched-link !text-[#60697b] btn-copy-icon" data-clipboard-text="&lt;img class=&quot;max-w-full h-auto&quot; src=_/assets/img/illustrations/ni9.html alt=&quot;&quot; /&gt;">Copy</a></div>
                 </div>
@@ -1243,9 +1243,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/docs/styleguide/misc.html b/public/docs/styleguide/misc.html
index 0144f8e..4c53870 100644
--- a/public/docs/styleguide/misc.html
+++ b/public/docs/styleguide/misc.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='../../contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,11 +578,11 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Usage</h6>
             <nav id="collapse-usage">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-<li><a class='!text-inherit hover:!text-[#3f78e0]' href='../index.html'>Get Started</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../forms.html'>Forms</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../faq.html'>FAQ</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../changelog.html'>Changelog</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../credits.html'>Credits</a></li>
+<li><a class='!text-inherit hover:!text-[#e31e24]' href='../index.html'>Get Started</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../forms.html'>Forms</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../faq.html'>FAQ</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../changelog.html'>Changelog</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../credits.html'>Credits</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -592,12 +592,12 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Styleguide</h6>
             <nav id="collapse-style">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class='!text-inherit hover:!text-[#3f78e0]' href='colors.html'>Colors</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='fonts.html'>Fonts</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-svg.html'>SVG Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='icons-font.html'>Font Icons</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='illustrations.html'>Illustrations</a></li>
-<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='backgrounds.html'>Backgrounds</a></li>
+                <li><a class='!text-inherit hover:!text-[#e31e24]' href='colors.html'>Colors</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='fonts.html'>Fonts</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-svg.html'>SVG Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='icons-font.html'>Font Icons</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='illustrations.html'>Illustrations</a></li>
+<li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='backgrounds.html'>Backgrounds</a></li>
 <li class="!mt-[0.35rem]"><a class='active' href='misc.html'>Misc</a></li>
               </ul>
             </nav>
@@ -608,33 +608,33 @@
             <h6 class="widget-title text-[0.85rem] !mb-2">Elements</h6>
             <nav id="collapse-elements">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/accordion.html'>Accordion</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/alerts.html'>Alerts</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/animations.html'>Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/avatars.html'>Avatars</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/background.html'>Background</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/badges.html'>Badges</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/buttons.html'>Buttons</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/card.html'>Card</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/carousel.html'>Carousel</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/dividers.html'>Dividers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/form-elements.html'>Form Elements</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-hover.html'>Image Hover</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/image-mask.html'>Image Mask</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/lightbox.html'>Lightbox</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/player.html'>Media Player</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/modal.html'>Modal</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/pagination.html'>Pagination</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/progressbar.html'>Progressbar</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shadows.html'>Shadows</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/shapes.html'>Shapes</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tables.html'>Tables</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tabs.html'>Tabs</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-animations.html'>Text Animations</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/text-highlight.html'>Text Highlight</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tiles.html'>Tiles</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#3f78e0]' href='../elements/typography.html'>Typography</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/accordion.html'>Accordion</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/alerts.html'>Alerts</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/animations.html'>Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/avatars.html'>Avatars</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/background.html'>Background</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/badges.html'>Badges</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/buttons.html'>Buttons</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/card.html'>Card</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/carousel.html'>Carousel</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/dividers.html'>Dividers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/form-elements.html'>Form Elements</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-hover.html'>Image Hover</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/image-mask.html'>Image Mask</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/lightbox.html'>Lightbox</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/player.html'>Media Player</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/modal.html'>Modal</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/pagination.html'>Pagination</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/progressbar.html'>Progressbar</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shadows.html'>Shadows</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/shapes.html'>Shapes</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tables.html'>Tables</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tabs.html'>Tabs</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-animations.html'>Text Animations</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/text-highlight.html'>Text Highlight</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tiles.html'>Tiles</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+          <li class="!mt-[0.35rem]"><a class='!text-inherit hover:!text-[#e31e24]' href='../elements/typography.html'>Typography</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -647,12 +647,12 @@
             <h6 class="widget-title text-[0.85rem] !mb-2 xl:!pl-5">On this page</h6>
             <nav class="xl:!pl-5" id="sidebar-nav">
               <ul class="list-unstyled !pl-0 list-none text-[0.7rem] leading-normal text-inherit">
-                <li><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Spacing</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-2">Font Size</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-3">Line Height</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-4">Letter Spacing</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-5">Gutters</a></li>
-                <li class="!mt-[0.35rem]"><a class="hover:!text-[#3f78e0] nav-link scroll !text-[0.7rem] " href="#snippet-6">Retina Images</a></li>
+                <li><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem]  active" href="#snippet-1">Spacing</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-2">Font Size</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-3">Line Height</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-4">Letter Spacing</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-5">Gutters</a></li>
+                <li class="!mt-[0.35rem]"><a class="hover:!text-[#e31e24] nav-link scroll !text-[0.7rem] " href="#snippet-6">Retina Images</a></li>
               </ul>
             </nav>
             <!-- /nav -->
@@ -665,7 +665,7 @@
             <h2 class="!mb-5 !leading-[1.35]">Spacing</h2>
             <div class="card">
               <div class="card-body flex-[1_1_auto] p-[40px]">
-                <p class="!mb-0">Trunçgil adds additional spacing variables to existing <a href="https://getbootstrap.com/docs/5.3/utilities/spacing/" class="external hover:!text-[#3f78e0] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">Bootstrap spacing</a> ranging between values <mark class="doc">0</mark> and <mark class="doc">25</mark></p>
+                <p class="!mb-0">Trunçgil adds additional spacing variables to existing <a href="https://getbootstrap.com/docs/5.3/utilities/spacing/" class="external hover:!text-[#e31e24] !pr-[1.4rem] after:content-['\e906'] after:text-[0.7rem] after:font-Custom" target="_blank">Bootstrap spacing</a> ranging between values <mark class="doc">0</mark> and <mark class="doc">25</mark></p>
               </div>
               <!--/.card-body -->
             </div>
@@ -816,9 +816,9 @@
     <!-- /.container -->
   </section>
   <!-- /section -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../../assets/js/plugins.js"></script>
diff --git a/public/html/404.html b/public/html/404.html
index e8cd07e..f197320 100644
--- a/public/html/404.html
+++ b/public/html/404.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -567,7 +567,7 @@
           <div class="lg:w-8/12 xl:w-7/12 xxl:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h1 class="!mb-3">Oops! Page Not Found.</h1>
             <p class="lead !leading-[1.65] text-[0.9rem] font-medium !mb-7 md:!px-14 lg:!px-5 xl:!px-7">The page you are looking for is not available or has been moved. Try a different page or go to homepage with the button below.</p>
-            <a class='btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='index.html'>Go to Homepage</a>
+            <a class='btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='index.html'>Go to Homepage</a>
           </div>
           <!-- /column -->
         </div>
@@ -601,7 +601,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -610,11 +610,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -632,7 +632,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -656,9 +656,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/about.html b/public/html/about.html
index 398e2d8..ccdd22f 100644
--- a/public/html/about.html
+++ b/public/html/about.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -576,7 +576,7 @@
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] !mb-[4.5rem] xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem] items-center">
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative xl:!order-2 lg:!order-2">
-            <div class="shape bg-dot primary bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"></div>
+            <div class="shape bg-dot primary bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"></div>
             <div class="flex flex-wrap !relative overlap-grid-2">
               <div class="item xl:w-[70%] xl:z-[3] xl:ml-[30%] xl:!mt-0 lg:w-[70%] lg:z-[3] lg:ml-[30%] lg:!mt-0 md:w-[70%] md:z-[3] md:ml-[30%] md:!mt-0">
                 <figure class="!rounded-[.4rem] shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] relative"><img class="!rounded-[.4rem] " src="../assets/img/photos/about2.jpg" alt="image"></figure>
@@ -595,15 +595,15 @@
             <div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px]">
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
                 </ul>
               </div>
               <!--/column -->
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
               </div>
               <!--/column -->
@@ -675,7 +675,7 @@
             <p class="lead text-[1rem] xl:!pr-5 lg:!pr-5">Find out everything you need to know and more about how we create our business process models.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare.</p>
             <p class="!mb-6">Nullam id dolor id nibh ultricies vehicula ut id elit. Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
           </div>
           <!--/column -->
         </div>
@@ -912,25 +912,25 @@
           <div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center">
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Expert Employees</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">4523</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Awards Won</p>
               </div>
@@ -949,7 +949,7 @@
       <div class="container pt-32 pb-[4.5rem] xl:pt-36 lg:pt-36 md:pt-36 xl:pb-24 lg:pb-24 md:pb-24">
         <div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-50px] items-center">
           <div class="md:w-8/12 lg:w-6/12 xl:w-5/12 lg:!ml-0 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"></div>
+            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem] w-full max-w-full !h-auto" src="../assets/img/photos/about4.jpg" alt="image"></figure>
           </div>
           <!--/column -->
@@ -958,7 +958,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-8">Convinced yet? Let's make something great together.</h2>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Address</h5>
@@ -967,7 +967,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Phone</h5>
@@ -976,7 +976,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">E-mail</h5>
@@ -1017,7 +1017,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1026,11 +1026,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1048,7 +1048,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1071,9 +1071,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/about2.html b/public/html/about2.html
index e793e66..ac5e972 100644
--- a/public/html/about2.html
+++ b/public/html/about2.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -612,7 +612,7 @@
         <!--/.row -->
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] xl:!mt-0 lg:!mt-0 md:!mt-0 !text-center">
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] max-w-full max-md:!mt-[30px]">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#3f78e0] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#e31e24] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
             <h4>Marketing</h4>
             <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
           </div>
@@ -649,11 +649,11 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">How It Works?</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">How It Works?</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7 xxl:!pr-5">Everything you need on creating a business process.</h3>
             <div class="flex flex-row !mb-4">
               <div>
-               <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  text-[#3f78e0] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
+               <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  text-[#e31e24] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Collect Ideas</h4>
@@ -688,12 +688,12 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Why Choose Us?</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Why Choose Us?</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">A few reasons why our valued customers choose us.</h3>
             <div class="accordion accordion-wrapper" id="accordionExample">
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne">
-                  <button class="accordion-button !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
+                  <button class="accordion-button !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
@@ -707,7 +707,7 @@
               <!--/.accordion-item -->
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
@@ -721,7 +721,7 @@
               <!--/.accordion-item -->
               <div class="card plain accordion-item">
                 <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree">
-                  <button class="collapsed !text-[.85rem] before:!text-[#3f78e0] hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
+                  <button class="collapsed !text-[.85rem] before:!text-[#e31e24] hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
                 </div>
                 <!--/.card-header -->
                 <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
@@ -747,10 +747,10 @@
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Meet the Team</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Meet the Team</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-5">Save your time and money by choosing our professional team.</h3>
             <p>Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros tempus porttitor.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
           </div>
           <!--/column -->
           <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
@@ -935,11 +935,11 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Get In Touch</h2>
+            <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Get In Touch</h2>
             <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">Got any questions? Don't hesitate to get in touch.</h3>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Address</h5>
@@ -948,7 +948,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Phone</h5>
@@ -957,7 +957,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">E-mail</h5>
@@ -997,7 +997,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1006,11 +1006,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1028,7 +1028,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1051,9 +1051,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/blog-post.html b/public/html/blog-post.html
index c41076a..1642e53 100644
--- a/public/html/blog-post.html
+++ b/public/html/blog-post.html
@@ -535,7 +535,7 @@
             <ul class="navbar-nav !flex-row !items-center !ml-auto">
               <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search"><i class="uil uil-search before:content-['\eca5'] !text-[1.1rem]"></i></a></li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -565,16 +565,16 @@
         <div class="flex flex-wrap mx-[-15px]">
           <div class="md:w-10/12 lg:w-10/12 xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="post-header !mb-[.9rem]">
-              <div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] !mb-[0.4rem]  text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+              <div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] !mb-[0.4rem]  text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                 <a href="#" class="hover" rel="category">Teamwork</a>
               </div>
               <!-- /.post-category -->
               <h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-4">Commodo Dolor Bibendum Parturient Cursus Mollis</h1>
               <ul class="!text-[0.8rem] !text-[#aab0bc] m-0 p-0 list-none !mb-5">
                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>5 Jul 2022</span></li>
-                <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
-                <li class="post-likes inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3<span> Likes</span></a></li>
+                <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
+                <li class="post-likes inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3<span> Likes</span></a></li>
               </ul>
               <!-- /.post-meta -->
             </div>
@@ -621,7 +621,7 @@
                         </div>
                         <!-- /.row -->
                         <p>Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus. Nullam quis risus eget urna mollis ornare vel eu leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna.</p>
-                        <blockquote class="border-l-[#3f78e0] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid !text-[1rem] !my-8">
+                        <blockquote class="border-l-[#e31e24] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid !text-[1rem] !my-8">
                           <p>Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis, est non commodo luctus, nisi erat porttitor ligula lacinia odio sem nec elit purus.</p>
                           <footer class="!text-[0.6rem] !text-[#aab0bc] !mb-4 before:content-['\2014\a0'] font-bold uppercase !tracking-[0.02rem] !mt-0">Very important person</footer>
                         </blockquote>
@@ -662,7 +662,7 @@
                     <div class="flex items-center">
                       <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u5.jpg"></figure>
                       <div>
-                        <h6><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                        <h6><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                         <span class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none">Sales Manager</span>
                       </div>
                     </div>
@@ -694,17 +694,17 @@
                           </figcaption>
                         </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Coding</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -721,17 +721,17 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Workspace</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -748,17 +748,17 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Meeting</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -775,16 +775,16 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Business Tips</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
                             </div>
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -808,7 +808,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u1.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Connor Gibson</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Connor Gibson</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>14 Jan 2022</li>
                               </ul>
@@ -830,7 +830,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>21 Feb 2022</li>
                               </ul>
@@ -852,7 +852,7 @@
                               <div class="flex items-center">
                                 <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u3.jpg"></figure>
                                 <div>
-                                  <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Pearce Frye</a></h6>
+                                  <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Pearce Frye</a></h6>
                                   <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                     <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>22 Feb 2022</li>
                                   </ul>
@@ -874,7 +874,7 @@
                                   <div class="flex items-center">
                                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                                     <div>
-                                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                         <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>4 Apr 2022</li>
                                       </ul>
@@ -900,7 +900,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u4.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Lou Bloxham</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Lou Bloxham</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>3 May 2022</li>
                               </ul>
@@ -940,7 +940,7 @@
                       <textarea name="textarea" class=" form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" style="height: 150px"></textarea>
                       <label class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Comment *</label>
                     </div>
-                    <button type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Submit</button>
+                    <button type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Submit</button>
                   </form>
                   <!-- /.comment-form -->
                 </div>
@@ -982,7 +982,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -991,11 +991,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1013,7 +1013,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1036,9 +1036,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/blog-post2.html b/public/html/blog-post2.html
index f4b0d40..e860955 100644
--- a/public/html/blog-post2.html
+++ b/public/html/blog-post2.html
@@ -622,7 +622,7 @@
                         </div>
                         <!-- /.row -->
                         <p>Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus. Nullam quis risus eget urna mollis ornare vel eu leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna.</p>
-                        <blockquote class="border-l-[#3f78e0] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid !text-[1rem] !my-8">
+                        <blockquote class="border-l-[#e31e24] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid !text-[1rem] !my-8">
                           <p>Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis, est non commodo luctus, nisi erat porttitor ligula lacinia odio sem nec elit purus.</p>
                           <footer class="!text-[0.6rem] !text-[#aab0bc] !mb-4 before:content-['\2014\a0'] font-bold uppercase !tracking-[0.02rem] !mt-0">Very important person</footer>
                         </blockquote>
@@ -663,7 +663,7 @@
                     <div class="flex items-center">
                       <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u5.jpg"></figure>
                       <div>
-                        <h6><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                        <h6><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                         <span class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none">Sales Manager</span>
                       </div>
                     </div>
@@ -695,17 +695,17 @@
                           </figcaption>
                         </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Coding</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -722,17 +722,17 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Workspace</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -749,17 +749,17 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Meeting</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -776,16 +776,16 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Business Tips</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
                             </div>
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -809,7 +809,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u1.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Connor Gibson</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Connor Gibson</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>14 Jan 2022</li>
                               </ul>
@@ -831,7 +831,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>21 Feb 2022</li>
                               </ul>
@@ -853,7 +853,7 @@
                               <div class="flex items-center">
                                 <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u3.jpg"></figure>
                                 <div>
-                                  <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Pearce Frye</a></h6>
+                                  <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Pearce Frye</a></h6>
                                   <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                     <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>22 Feb 2022</li>
                                   </ul>
@@ -875,7 +875,7 @@
                                   <div class="flex items-center">
                                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                                     <div>
-                                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                         <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>4 Apr 2022</li>
                                       </ul>
@@ -901,7 +901,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u4.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Lou Bloxham</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Lou Bloxham</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>3 May 2022</li>
                               </ul>
@@ -941,7 +941,7 @@
                       <textarea name="textarea" class=" form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" style="height: 150px"></textarea>
                       <label class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Comment *</label>
                     </div>
-                    <button type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Submit</button>
+                    <button type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Submit</button>
                   </form>
                   <!-- /.comment-form -->
                 </div>
@@ -981,10 +981,10 @@
                 <li class=" clear-both block overflow-hidden">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a1.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Mar 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -992,10 +992,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"> <a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a2.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>16 Feb 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -1003,10 +1003,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a3.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>8 Jan 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -1018,12 +1018,12 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Categories</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Teamwork (21)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Ideas (19)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Workspace (16)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Coding (7)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Meeting (12)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Business Tips (14)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Teamwork (21)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Ideas (19)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Workspace (16)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Coding (7)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Meeting (12)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Business Tips (14)</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -1044,11 +1044,11 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Archive</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">February 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">January 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">December 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">November 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">October 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">February 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">January 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">December 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">November 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">October 2018</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -1085,7 +1085,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1094,11 +1094,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1116,7 +1116,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1139,9 +1139,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/blog-post3.html b/public/html/blog-post3.html
index 31163a3..b98a115 100644
--- a/public/html/blog-post3.html
+++ b/public/html/blog-post3.html
@@ -622,7 +622,7 @@
                         </div>
                         <!-- /.row -->
                         <p>Maecenas sed diam eget risus varius blandit sit amet non magna. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec sed odio dui. Nulla vitae elit libero, a pharetra augue. Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus. Nullam quis risus eget urna mollis ornare vel eu leo. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed posuere consectetur est at lobortis. Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna.</p>
-                        <blockquote class="border-l-[#3f78e0] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid !text-[1rem] !my-8">
+                        <blockquote class="border-l-[#e31e24] !leading-[1.7] font-medium !pl-4 border-l-[0.15rem] border-solid !text-[1rem] !my-8">
                           <p>Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis mollis, est non commodo luctus, nisi erat porttitor ligula lacinia odio sem nec elit purus.</p>
                           <footer class="!text-[0.6rem] !text-[#aab0bc] !mb-4 before:content-['\2014\a0'] font-bold uppercase !tracking-[0.02rem] !mt-0">Very important person</footer>
                         </blockquote>
@@ -663,7 +663,7 @@
                     <div class="flex items-center">
                       <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u5.jpg"></figure>
                       <div>
-                        <h6><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                        <h6><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                         <span class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none">Sales Manager</span>
                       </div>
                     </div>
@@ -695,17 +695,17 @@
                           </figcaption>
                         </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Coding</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -722,17 +722,17 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Workspace</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -749,17 +749,17 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Meeting</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                             </div>
                             <!-- /.post-header -->
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -776,16 +776,16 @@
                               </figcaption>
                             </figure>
                             <div class="post-header !mb-[.9rem]">
-                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                 <a href="#" class="hover" rel="category">Business Tips</a>
                               </div>
                               <!-- /.post-category -->
-                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
+                              <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
                             </div>
                             <div class="post-footer">
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none  !mb-0">
                                 <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                                <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
                               </ul>
                               <!-- /.post-meta -->
                             </div>
@@ -809,7 +809,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u1.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Connor Gibson</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Connor Gibson</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>14 Jan 2022</li>
                               </ul>
@@ -831,7 +831,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>21 Feb 2022</li>
                               </ul>
@@ -853,7 +853,7 @@
                               <div class="flex items-center">
                                 <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u3.jpg"></figure>
                                 <div>
-                                  <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Pearce Frye</a></h6>
+                                  <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Pearce Frye</a></h6>
                                   <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                     <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>22 Feb 2022</li>
                                   </ul>
@@ -875,7 +875,7 @@
                                   <div class="flex items-center">
                                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                                     <div>
-                                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                         <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>4 Apr 2022</li>
                                       </ul>
@@ -901,7 +901,7 @@
                           <div class="flex items-center">
                             <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u4.jpg"></figure>
                             <div>
-                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Lou Bloxham</a></h6>
+                              <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Lou Bloxham</a></h6>
                               <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                 <li><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>3 May 2022</li>
                               </ul>
@@ -941,7 +941,7 @@
                       <textarea name="textarea" class=" form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" style="height: 150px"></textarea>
                       <label class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Comment *</label>
                     </div>
-                    <button type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Submit</button>
+                    <button type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Submit</button>
                   </form>
                   <!-- /.comment-form -->
                 </div>
@@ -981,10 +981,10 @@
                 <li class=" clear-both block overflow-hidden">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a1.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Mar 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -992,10 +992,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"> <a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a2.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>16 Feb 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -1003,10 +1003,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a3.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>8 Jan 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -1018,12 +1018,12 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Categories</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Teamwork (21)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Ideas (19)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Workspace (16)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Coding (7)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Meeting (12)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Business Tips (14)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Teamwork (21)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Ideas (19)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Workspace (16)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Coding (7)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Meeting (12)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Business Tips (14)</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -1044,11 +1044,11 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Archive</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">February 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">January 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">December 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">November 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">October 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">February 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">January 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">December 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">November 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">October 2018</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -1085,7 +1085,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1094,11 +1094,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1116,7 +1116,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1139,9 +1139,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/blog.html b/public/html/blog.html
index e4c2c07..8ec39b7 100644
--- a/public/html/blog.html
+++ b/public/html/blog.html
@@ -535,7 +535,7 @@
             <ul class="navbar-nav !flex-row !items-center !ml-auto">
               <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search"><i class="uil uil-search before:content-['\eca5'] !text-[1.1rem]"></i></a></li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -581,18 +581,18 @@
             <div class="blog classic-view !mt-[-7rem]">
               <article class="post !mb-8">
                 <div class="card">
-                  <figure class="card-img-top overlay overlay-1 hover-scale group"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'><img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="../assets/img/photos/b1.jpg" alt="image"></a>
+                  <figure class="card-img-top overlay overlay-1 hover-scale group"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'><img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="../assets/img/photos/b1.jpg" alt="image"></a>
                     <figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
                       <h5 class="from-top  !mb-0 absolute w-full translate-y-[-80%] p-[.75rem_1rem] left-0 top-2/4">Read More</h5>
                     </figcaption>
                   </figure>
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Teamwork</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Amet Dolor Bibendum Parturient Cursus</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Amet Dolor Bibendum Parturient Cursus</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -604,9 +604,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>5 Jul 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -633,11 +633,11 @@
                   <!-- /.post-slider -->
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Ideas</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -649,9 +649,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>25 Jun 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>4</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>4</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -667,11 +667,11 @@
                   </div>
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Workspace</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Consectetur Bibendum Sollicitudin Vulputate</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Consectetur Bibendum Sollicitudin Vulputate</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -683,9 +683,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>18 May 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>8<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>6</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>8<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -707,11 +707,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Coding</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -723,8 +723,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -742,11 +742,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Workspace</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -758,8 +758,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -777,11 +777,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Meeting</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -793,8 +793,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -812,11 +812,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Business Tips</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
                       </div>
                       <div class="!relative">
                         <p>Mauris convallis non ligula non interdum. Gravida vulputate convallis tempus vestibulum cras imperdiet nun eu dolor. Aenean lacinia bibendum nulla sed.</p>
@@ -827,8 +827,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -893,7 +893,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -902,11 +902,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -924,7 +924,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -947,9 +947,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/blog2.html b/public/html/blog2.html
index 18c47f6..5b4c711 100644
--- a/public/html/blog2.html
+++ b/public/html/blog2.html
@@ -535,7 +535,7 @@
             <ul class="navbar-nav !flex-row !items-center !ml-auto">
               <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search"><i class="uil uil-search before:content-['\eca5'] !text-[1.1rem]"></i></a></li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -584,18 +584,18 @@
             <div class="blog classic-view">
               <article class="post !mb-8">
                 <div class="card">
-                  <figure class="card-img-top overlay overlay-1 hover-scale group"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'><img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="../assets/img/photos/b1.jpg" alt="image"></a>
+                  <figure class="card-img-top overlay overlay-1 hover-scale group"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'><img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="../assets/img/photos/b1.jpg" alt="image"></a>
                     <figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
                       <h5 class="from-top  !mb-0 absolute w-full translate-y-[-80%] p-[.75rem_1rem] left-0 top-2/4">Read More</h5>
                     </figcaption>
                   </figure>
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Teamwork</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Amet Dolor Bibendum Parturient Cursus</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Amet Dolor Bibendum Parturient Cursus</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -607,9 +607,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>5 Jul 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -636,11 +636,11 @@
                   <!-- /.post-slider -->
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Ideas</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -652,9 +652,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>25 Jun 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>4</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>4</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -670,11 +670,11 @@
                   </div>
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Workspace</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Consectetur Bibendum Sollicitudin Vulputate</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Consectetur Bibendum Sollicitudin Vulputate</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -686,9 +686,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>18 May 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>8<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>6</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>8<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -710,11 +710,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Coding</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -726,8 +726,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -745,11 +745,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Workspace</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -761,8 +761,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -780,11 +780,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Meeting</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -796,8 +796,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -815,11 +815,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Business Tips</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
                       </div>
                       <div class="!relative">
                         <p>Mauris convallis non ligula non interdum. Gravida vulputate convallis tempus vestibulum cras imperdiet nun eu dolor. Aenean lacinia bibendum nulla sed.</p>
@@ -830,8 +830,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -895,10 +895,10 @@
                 <li class=" clear-both block overflow-hidden">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a1.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Mar 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -906,10 +906,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"> <a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a2.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>16 Feb 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -917,10 +917,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a3.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>8 Jan 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -932,12 +932,12 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Categories</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Teamwork (21)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Ideas (19)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Workspace (16)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Coding (7)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Meeting (12)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Business Tips (14)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Teamwork (21)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Ideas (19)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Workspace (16)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Coding (7)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Meeting (12)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Business Tips (14)</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -958,11 +958,11 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Archive</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">February 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">January 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">December 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">November 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">October 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">February 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">January 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">December 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">November 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">October 2018</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -999,7 +999,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1008,11 +1008,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1030,7 +1030,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1053,9 +1053,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/blog3.html b/public/html/blog3.html
index 5495e23..3c26f9e 100644
--- a/public/html/blog3.html
+++ b/public/html/blog3.html
@@ -535,7 +535,7 @@
             <ul class="navbar-nav !flex-row !items-center !ml-auto">
               <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-search"><i class="uil uil-search before:content-['\eca5'] !text-[1.1rem]"></i></a></li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -584,18 +584,18 @@
             <div class="blog classic-view">
               <article class="post !mb-8">
                 <div class="card">
-                  <figure class="card-img-top overlay overlay-1 hover-scale group"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'><img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="../assets/img/photos/b1.jpg" alt="image"></a>
+                  <figure class="card-img-top overlay overlay-1 hover-scale group"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'><img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="../assets/img/photos/b1.jpg" alt="image"></a>
                     <figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
                       <h5 class="from-top  !mb-0 absolute w-full translate-y-[-80%] p-[.75rem_1rem] left-0 top-2/4">Read More</h5>
                     </figcaption>
                   </figure>
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Teamwork</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Amet Dolor Bibendum Parturient Cursus</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Amet Dolor Bibendum Parturient Cursus</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -607,9 +607,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>5 Jul 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -636,11 +636,11 @@
                   <!-- /.post-slider -->
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Ideas</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Fringilla Ligula Pharetra Amet</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -652,9 +652,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>25 Jun 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>4</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>4</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -670,11 +670,11 @@
                   </div>
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4  ">
                     <div class="post-header !mb-[.9rem]">
-                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                      <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                         <a href="#" class="hover" rel="category">Workspace</a>
                       </div>
                       <!-- /.post-category -->
-                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Consectetur Bibendum Sollicitudin Vulputate</a></h2>
+                      <h2 class="post-title !mt-1 !leading-[1.35] !mb-0"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Consectetur Bibendum Sollicitudin Vulputate</a></h2>
                     </div>
                     <!-- /.post-header -->
                     <div class="!relative">
@@ -686,9 +686,9 @@
                   <div class="card-footer xl:!p-[1.25rem_2.5rem_1.25rem] lg:!p-[1.25rem_2.5rem_1.25rem] md:!p-[1.25rem_2.5rem_1.25rem] p-[18px_40px]">
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>18 May 2022</span></li>
-                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>8<span> Comments</span></a></li>
-                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>6</a></li>
+                      <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i><span>By Trunçgil</span></a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>8<span> Comments</span></a></li>
+                      <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -710,11 +710,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Coding</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -726,8 +726,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>4</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -745,11 +745,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Workspace</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -761,8 +761,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -780,11 +780,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Meeting</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                       </div>
                       <!-- /.post-header -->
                       <div class="!relative">
@@ -796,8 +796,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>3</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -815,11 +815,11 @@
                     </figure>
                     <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4  ">
                       <div class="post-header !mb-[.9rem]">
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="#" class="hover" rel="category">Business Tips</a>
                         </div>
                         <!-- /.post-category -->
-                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
+                        <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Morbi leo risus porta eget</a></h2>
                       </div>
                       <div class="!relative">
                         <p>Mauris convallis non ligula non interdum. Gravida vulputate convallis tempus vestibulum cras imperdiet nun eu dolor. Aenean lacinia bibendum nulla sed.</p>
@@ -830,8 +830,8 @@
                     <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] p-[18px_40px]">
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                         <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>7 Jan 2022</span></li>
-                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
-                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
+                        <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>2</a></li>
+                        <li class="post-likes !ml-auto inline-block"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-heart-alt pr-[0.2rem] align-[-.05rem] before:content-['\eb60']"></i>5</a></li>
                       </ul>
                       <!-- /.post-meta -->
                     </div>
@@ -895,10 +895,10 @@
                 <li class=" clear-both block overflow-hidden">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a1.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Magna Mollis Ultricies</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Mar 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>3</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -906,10 +906,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"> <a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a2.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ornare Nullam Risus</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>16 Feb 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>6</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -917,10 +917,10 @@
                 <li class=" clear-both block overflow-hidden !mt-4">
                   <figure class="!rounded-[.4rem] float-left w-14 !h-[4.5rem]"><a href='blog-post.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/a3.jpg" alt="image"></a></figure>
                   <div class="!relative !ml-[4.25rem] !mb-0">
-                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
+                    <h6 class="!mb-2"> <a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Euismod Nullam Fusce</a> </h6>
                     <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                       <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>8 Jan 2022</span></li>
-                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
+                      <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>5</a></li>
                     </ul>
                     <!-- /.post-meta -->
                   </div>
@@ -932,12 +932,12 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Categories</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Teamwork (21)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Ideas (19)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Workspace (16)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Coding (7)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Meeting (12)</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Business Tips (14)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Teamwork (21)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Ideas (19)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Workspace (16)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Coding (7)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Meeting (12)</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Business Tips (14)</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -958,11 +958,11 @@
             <div class="widget !mt-[40px]">
               <h4 class="widget-title !mb-3">Archive</h4>
               <ul class="pl-0 list-none bullet-primary !text-inherit">
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">February 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">January 2019</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">December 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">November 2018</a></li>
-        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">October 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">February 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">January 2019</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">December 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">November 2018</a></li>
+        <li class="relative !pl-[1rem] before:absolute  before:top-[-0.15rem] before:text-[1rem] before:content-['\2022'] before:left-0 before:font-SansSerif !mt-[.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">October 2018</a></li>
               </ul>
             </div>
             <!-- /.widget -->
@@ -999,7 +999,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1008,11 +1008,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1030,7 +1030,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1053,9 +1053,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/career-job.html b/public/html/career-job.html
index 48d0dd5..afa741b 100644
--- a/public/html/career-job.html
+++ b/public/html/career-job.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -594,15 +594,15 @@
                   <div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px]">
                     <div class="xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[20px] !px-[15px] max-w-full !mt-[15px]">
                       <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
                       </ul>
                     </div>
                     <!--/column -->
                     <div class="xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[20px] !px-[15px] max-w-full !mt-[15px]">
                       <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                       </ul>
                     </div>
                     <!--/column -->
@@ -613,21 +613,21 @@
                   <div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px] !mb-10">
                     <div class="xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[20px] !px-[15px] max-w-full !mt-[15px]">
                       <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
                       </ul>
                     </div>
                     <!--/column -->
                     <div class="xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[20px] !px-[15px] max-w-full !mt-[15px]">
                       <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                        <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                        <li class="relative !mt-[0.35rem] !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                       </ul>
                     </div>
                     <!--/column -->
                   </div>
                   <!--/.row -->
-                  <a href="mailto:apply@email.com" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Apply Now</a>
+                  <a href="mailto:apply@email.com" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Apply Now</a>
                 </div>
                 <!-- /.card-body -->
               </div>
@@ -650,7 +650,7 @@
           </div>
           <!--/column -->
           <div class="md:w-4/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-auto lg:!ml-auto md:!ml-auto xl:!text-right lg:!text-right md:!text-right !mt-5 xl:!mt-0 lg:!mt-0 md:!mt-0">
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Explore Positions</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Explore Positions</a>
           </div>
           <!--/column -->
         </div>
@@ -663,7 +663,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(226,98,107)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">SD</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Senior Graphic Designer</h4>
                   <p class="!mb-0 !text-[#60697b]">San Francisco, US</p>
                 </div>
@@ -693,7 +693,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(250,183,88)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">AN</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Multimedia Artist &amp; Animator</h4>
                   <p class="!mb-0 !text-[#60697b]">Birmingham, UK</p>
                 </div>
@@ -723,7 +723,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(247,139,119)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">MD</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Mobile Developer</h4>
                   <p class="!mb-0 !text-[#60697b]">San Francisco, US</p>
                 </div>
@@ -738,7 +738,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[rgba(209,107,134)] !opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">ND</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">.NET Developer</h4>
                   <p class="!mb-0 !text-[#60697b]">Manchester, UK</p>
                 </div>
@@ -777,7 +777,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -786,11 +786,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -808,7 +808,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -831,9 +831,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/career.html b/public/html/career.html
index e7a569c..1efda1a 100644
--- a/public/html/career.html
+++ b/public/html/career.html
@@ -21,7 +21,7 @@
   }
   .accordion-wrapper .card-header button:hover,
   .accordion-wrapper .card-header button{
-      color: #3f78e0 !important;
+      color: #e31e24 !important;
     }
     </style>
 </head>
@@ -545,13 +545,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -570,7 +570,7 @@
       <div class="container pt-10 pb-[8rem] md:!pb-[10rem] xl:!pt-[4.5rem] lg:!pt-[4.5rem] md:!pt-[4.5rem] xl:!pb-[12.5rem] lg:!pb-[12.5rem] !text-center">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-12">
-            <h1 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !mb-3 !leading-[1.3]">Join Our Team</h1>
+            <h1 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !mb-3 !leading-[1.3]">Join Our Team</h1>
             <h3 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem]">We bring solutions to make life easier for our customers.</h3>
           </div>
           <!-- /column -->
@@ -595,7 +595,7 @@
           <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
             <div class="flex flex-row">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.1 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/target.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mr-4"><path class="fill-secondary" d="M178.66 79.37L166.93 91.1a76.68 76.68 0 014.91 11.52 85.77 85.77 0 0114.93-1.28h1.39a93.65 93.65 0 00-9.5-21.97zM0 128a96.1 96.1 0 00109.65 95 82.93 82.93 0 01-5.65-15.42 67 67 0 01-8 .43A80 80 0 0196 48a79 79 0 0137 9.17l11.73-11.73A94.73 94.73 0 0096 32a96.14 96.14 0 00-96 96z"></path><path class="fill-secondary" d="M37.33 128A58.78 58.78 0 0096 186.68a47.26 47.26 0 005.44-.32A82.71 82.71 0 01103 170a37.32 37.32 0 01-7 .64 42.67 42.67 0 010-85.34 32.88 32.88 0 018 .84l12.91-12.91a57 57 0 00-20.91-4A58.81 58.81 0 0037.33 128z"></path><path class="fill-secondary" d="M96 106.68A21.33 21.33 0 10117.33 128 21.39 21.39 0 0096 106.68zm0 26.66a5.33 5.33 0 115.33-5.33 5.28 5.28 0 01-5.33 5.33z"></path><path class="fill-primary" d="M96.1 136a8 8 0 01-5.67-13.65L159.76 53a8 8 0 0111.31 11.31l-69.33 69.33A8 8 0 0196.1 136z"></path><path class="fill-primary" d="M194.77 64H168.1a8 8 0 01-8-8V29.34a8.08 8.08 0 012.33-5.67l21.33-21.33A8 8 0 01197.42 8v18.68h18.68a8 8 0 015.66 13.66l-21.33 21.33a8 8 0 01-5.66 2.33zm-8 53.34a69.34 69.34 0 1069.33 69.34 69.4 69.4 0 00-69.33-69.34zm29.87 56.11L182 210.78a8 8 0 01-11.09.64l-18.67-16a8 8 0 1110.41-12.15l12.84 11 29.44-31.69a8 8 0 0111.74 10.88z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.1 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/target.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mr-4"><path class="fill-secondary" d="M178.66 79.37L166.93 91.1a76.68 76.68 0 014.91 11.52 85.77 85.77 0 0114.93-1.28h1.39a93.65 93.65 0 00-9.5-21.97zM0 128a96.1 96.1 0 00109.65 95 82.93 82.93 0 01-5.65-15.42 67 67 0 01-8 .43A80 80 0 0196 48a79 79 0 0137 9.17l11.73-11.73A94.73 94.73 0 0096 32a96.14 96.14 0 00-96 96z"></path><path class="fill-secondary" d="M37.33 128A58.78 58.78 0 0096 186.68a47.26 47.26 0 005.44-.32A82.71 82.71 0 01103 170a37.32 37.32 0 01-7 .64 42.67 42.67 0 010-85.34 32.88 32.88 0 018 .84l12.91-12.91a57 57 0 00-20.91-4A58.81 58.81 0 0037.33 128z"></path><path class="fill-secondary" d="M96 106.68A21.33 21.33 0 10117.33 128 21.39 21.39 0 0096 106.68zm0 26.66a5.33 5.33 0 115.33-5.33 5.28 5.28 0 01-5.33 5.33z"></path><path class="fill-primary" d="M96.1 136a8 8 0 01-5.67-13.65L159.76 53a8 8 0 0111.31 11.31l-69.33 69.33A8 8 0 0196.1 136z"></path><path class="fill-primary" d="M194.77 64H168.1a8 8 0 01-8-8V29.34a8.08 8.08 0 012.33-5.67l21.33-21.33A8 8 0 01197.42 8v18.68h18.68a8 8 0 015.66 13.66l-21.33 21.33a8 8 0 01-5.66 2.33zm-8 53.34a69.34 69.34 0 1069.33 69.34 69.4 69.4 0 00-69.33-69.34zm29.87 56.11L182 210.78a8 8 0 01-11.09.64l-18.67-16a8 8 0 1110.41-12.15l12.84 11 29.44-31.69a8 8 0 0111.74 10.88z"></path></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Career Growth</h4>
@@ -607,7 +607,7 @@
           <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
             <div class="flex flex-row">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 202.68" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/video-chat.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mr-4"><g data-name="Layer 2"><path class="fill-primary" d="M245.33 181.33H10.67a10.68 10.68 0 000 21.35h234.67a10.68 10.68 0 100-21.35z"></path><path class="fill-primary" d="M112 66.66a28.3 28.3 0 001.07 8h-70.4v106.67H21.33V74.66a21.39 21.39 0 0121.33-21.33H112zm122.67 30.51v84.16h-21.33v-81a33.47 33.47 0 0014.93-7.79l5.33 4a3.67 3.67 0 001.07.64z"></path><circle class="fill-primary" cx="117.33" cy="117.33" r="21.33"></circle><path class="fill-primary" d="M160 178.66v2.67H74.67v-2.67A29.32 29.32 0 01104 149.33h26.67A29.32 29.32 0 01160 178.66z"></path><path class="fill-secondary" d="M248 85.33a8 8 0 01-4.8-1.6L223.82 69.2a18.67 18.67 0 01-18.49 16.13h-58.67A18.68 18.68 0 01128 66.66V16c0-7.37 4.9-16 18.67-16h58.67A18.69 18.69 0 01224 17.62l18.9-15.76A8 8 0 01256 8v69.33a8 8 0 01-4.42 7.15 7.82 7.82 0 01-3.58.85z"></path></g></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 202.68" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/video-chat.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mr-4"><g data-name="Layer 2"><path class="fill-primary" d="M245.33 181.33H10.67a10.68 10.68 0 000 21.35h234.67a10.68 10.68 0 100-21.35z"></path><path class="fill-primary" d="M112 66.66a28.3 28.3 0 001.07 8h-70.4v106.67H21.33V74.66a21.39 21.39 0 0121.33-21.33H112zm122.67 30.51v84.16h-21.33v-81a33.47 33.47 0 0014.93-7.79l5.33 4a3.67 3.67 0 001.07.64z"></path><circle class="fill-primary" cx="117.33" cy="117.33" r="21.33"></circle><path class="fill-primary" d="M160 178.66v2.67H74.67v-2.67A29.32 29.32 0 01104 149.33h26.67A29.32 29.32 0 01160 178.66z"></path><path class="fill-secondary" d="M248 85.33a8 8 0 01-4.8-1.6L223.82 69.2a18.67 18.67 0 01-18.49 16.13h-58.67A18.68 18.68 0 01128 66.66V16c0-7.37 4.9-16 18.67-16h58.67A18.69 18.69 0 01224 17.62l18.9-15.76A8 8 0 01256 8v69.33a8 8 0 01-4.42 7.15 7.82 7.82 0 01-3.58.85z"></path></g></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Work From Anywhere</h4>
@@ -619,7 +619,7 @@
           <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
             <div class="flex flex-row">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/wallet.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mr-4"><path class="fill-secondary" d="M184.21 42.75L161.57 4a8 8 0 00-4.91-3.76 8.1 8.1 0 00-6.12.9L81.31 42.66z"></path><path class="fill-primary" d="M32 53.33A10.67 10.67 0 0132 32h36l35.63-21.33H32A32 32 0 00.53 37.33 10.9 10.9 0 000 40v162.67a32.09 32.09 0 0032 32h181.33a21.39 21.39 0 0021.33-21.32V192H208a48 48 0 110-96h26.67V74.69a21.39 21.39 0 00-21.33-21.33H32zM202.67 32a21.3 21.3 0 00-18.45-21.12l18.45 31.79z"></path><path class="fill-secondary" d="M248 112h-40a32 32 0 000 64h40a8 8 0 008-8v-48a8 8 0 00-8-8zm-40 42.66A10.67 10.67 0 11218.67 144 10.68 10.68 0 01208 154.66z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/wallet.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mr-4"><path class="fill-secondary" d="M184.21 42.75L161.57 4a8 8 0 00-4.91-3.76 8.1 8.1 0 00-6.12.9L81.31 42.66z"></path><path class="fill-primary" d="M32 53.33A10.67 10.67 0 0132 32h36l35.63-21.33H32A32 32 0 00.53 37.33 10.9 10.9 0 000 40v162.67a32.09 32.09 0 0032 32h181.33a21.39 21.39 0 0021.33-21.32V192H208a48 48 0 110-96h26.67V74.69a21.39 21.39 0 00-21.33-21.33H32zM202.67 32a21.3 21.3 0 00-18.45-21.12l18.45 31.79z"></path><path class="fill-secondary" d="M248 112h-40a32 32 0 000 64h40a8 8 0 008-8v-48a8 8 0 00-8-8zm-40 42.66A10.67 10.67 0 11218.67 144 10.68 10.68 0 01208 154.66z"></path></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Smart Salary</h4>
@@ -631,7 +631,7 @@
           <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
             <div class="flex flex-row">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/building.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mr-4"><g data-name="Layer 2"><path class="fill-secondary" d="M250.58 30.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.09 8.09 0 006.26 0c2.48-1.08 60.86-26.48 60.86-78.8V37.71a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.66 10.66 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19L187.82 86l22.47-28.57a10.66 10.66 0 0116.77 13.18z"></path><path class="fill-primary" d="M173.87 175.89c-2.56-1.28-5.23-2.67-8-4.37a20.31 20.31 0 018 4.37z"></path><path class="fill-primary" d="M192 234.67h-24v-22.93a21.33 21.33 0 10-16 0v22.93h-24V149a10.67 10.67 0 10-21.34 0v85.65H85.33V200a8 8 0 00-8-8H50.66a8 8 0 00-8 8v34.67H21.33V69.33H96a10.68 10.68 0 0010.67-10.67V40A18.7 18.7 0 0088 21.31H74.67V10.67a10.67 10.67 0 00-21.34 0v10.67H40A18.69 18.69 0 0021.33 40v8A21.36 21.36 0 000 69.33v176A10.66 10.66 0 0010.67 256H192a10.67 10.67 0 100-21.33z"></path><path class="fill-primary" d="M77.33 144H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0-64H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0 32H50.66a8 8 0 000 16h26.67a8 8 0 000-16z"></path></g></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/building.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mr-4"><g data-name="Layer 2"><path class="fill-secondary" d="M250.58 30.14l-56-19a8 8 0 00-5.16 0l-56 19a8 8 0 00-5.42 7.57v42.87c0 52.32 58.38 77.72 60.88 78.8a8.09 8.09 0 006.26 0c2.48-1.08 60.86-26.48 60.86-78.8V37.71a8 8 0 00-5.42-7.57zm-23.52 40.45l-29.33 37.33a10.66 10.66 0 01-15.33 1.5l-18.67-16a10.66 10.66 0 0113.87-16.19L187.82 86l22.47-28.57a10.66 10.66 0 0116.77 13.18z"></path><path class="fill-primary" d="M173.87 175.89c-2.56-1.28-5.23-2.67-8-4.37a20.31 20.31 0 018 4.37z"></path><path class="fill-primary" d="M192 234.67h-24v-22.93a21.33 21.33 0 10-16 0v22.93h-24V149a10.67 10.67 0 10-21.34 0v85.65H85.33V200a8 8 0 00-8-8H50.66a8 8 0 00-8 8v34.67H21.33V69.33H96a10.68 10.68 0 0010.67-10.67V40A18.7 18.7 0 0088 21.31H74.67V10.67a10.67 10.67 0 00-21.34 0v10.67H40A18.69 18.69 0 0021.33 40v8A21.36 21.36 0 000 69.33v176A10.66 10.66 0 0010.67 256H192a10.67 10.67 0 100-21.33z"></path><path class="fill-primary" d="M77.33 144H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0-64H50.66a8 8 0 000 16h26.67a8 8 0 000-16zm0 32H50.66a8 8 0 000 16h26.67a8 8 0 000-16z"></path></g></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Medical Insurance</h4>
@@ -643,7 +643,7 @@
           <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
             <div class="flex flex-row">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/alarm.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mr-4"><path class="fill-secondary" d="M26.64 256a10.66 10.66 0 01-8.26-17.4l23.33-28.67a10.67 10.67 0 1116.55 13.47l-23.33 28.67a10.65 10.65 0 01-8.29 3.93zm202.69 0a10.65 10.65 0 01-8.29-3.93l-23.33-28.67a10.67 10.67 0 0116.55-13.47l23.32 28.67a10.66 10.66 0 01-8.25 17.4zM10.66 72a10.66 10.66 0 01-7.54-18.2L53.79 3.13a10.67 10.67 0 0115.09 15.08L18.21 68.88A10.68 10.68 0 0110.66 72zm234.65 0a10.55 10.55 0 01-7.53-3.12L187.1 18.21a10.67 10.67 0 1115.09-15.08l50.67 50.67a10.66 10.66 0 01-7.55 18.2z"></path><path class="fill-primary" d="M128 32a112 112 0 10112 112A112.12 112.12 0 00128 32zm66.68 122.68H128A10.68 10.68 0 01117.31 144V80a10.68 10.68 0 0121.35 0v53.33h56a10.68 10.68 0 010 21.35z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/alarm.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mr-4"><path class="fill-secondary" d="M26.64 256a10.66 10.66 0 01-8.26-17.4l23.33-28.67a10.67 10.67 0 1116.55 13.47l-23.33 28.67a10.65 10.65 0 01-8.29 3.93zm202.69 0a10.65 10.65 0 01-8.29-3.93l-23.33-28.67a10.67 10.67 0 0116.55-13.47l23.32 28.67a10.66 10.66 0 01-8.25 17.4zM10.66 72a10.66 10.66 0 01-7.54-18.2L53.79 3.13a10.67 10.67 0 0115.09 15.08L18.21 68.88A10.68 10.68 0 0110.66 72zm234.65 0a10.55 10.55 0 01-7.53-3.12L187.1 18.21a10.67 10.67 0 1115.09-15.08l50.67 50.67a10.66 10.66 0 01-7.55 18.2z"></path><path class="fill-primary" d="M128 32a112 112 0 10112 112A112.12 112.12 0 00128 32zm66.68 122.68H128A10.68 10.68 0 01117.31 144V80a10.68 10.68 0 0121.35 0v53.33h56a10.68 10.68 0 010 21.35z"></path></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Flexible Hours</h4>
@@ -655,7 +655,7 @@
           <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px] xl:!px-[35px] lg:!px-[20px]">
             <div class="flex flex-row">
               <div>
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/employees.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mr-4"><path class="fill-secondary" d="M72.11 86.51l-3.52-21 1.41-1.4-4.36-4.48a24.12 24.12 0 01-5.78-24.43c.11-.32.2-.53.32-.85l-1.4-.21-9-18.88a8 8 0 00-14.49 0l-8.88 19-19.69 3.07a8 8 0 00-6.29 5.44 7.94 7.94 0 001.92 8.11l14.51 14.83-3.42 21A8.07 8.07 0 0021.33 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8 8 0 003.21-7.89zm183.46-44.06a7.85 7.85 0 00-6.4-5.33l-19.73-3-9-18.88a8 8 0 00-14.5 0l-8.86 19-1.17.21c0 .11.11.21.11.32a23.76 23.76 0 01-5.44 24.32L185.81 64l1.71 1.71-3.41 21A8.07 8.07 0 00192 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8.06 8.06 0 003.2-7.89l-3.52-21 14.51-14.92a8.09 8.09 0 001.81-8.13z"></path><path class="fill-primary" d="M100.18 106.67a8 8 0 01-7.91-9.25l4.61-28.8L77 48.37a8 8 0 014.46-13.51l27.09-4.22 12.11-26a8 8 0 017.2-4.64 8 8 0 017.23 4.58l12.29 25.9 27.12 4.05A8 8 0 01179.09 48l-19.78 20.38 4.8 28.77a8 8 0 01-11.74 8.34l-24.19-13.25-24.12 13.42a7.94 7.94 0 01-3.88 1z"></path><circle class="fill-secondary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-secondary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-secondary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-secondary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-primary" cx="128" cy="154.67" r="32"></circle><path class="fill-primary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/employees.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mr-4"><path class="fill-secondary" d="M72.11 86.51l-3.52-21 1.41-1.4-4.36-4.48a24.12 24.12 0 01-5.78-24.43c.11-.32.2-.53.32-.85l-1.4-.21-9-18.88a8 8 0 00-14.49 0l-8.88 19-19.69 3.07a8 8 0 00-6.29 5.44 7.94 7.94 0 001.92 8.11l14.51 14.83-3.42 21A8.07 8.07 0 0021.33 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8 8 0 003.21-7.89zm183.46-44.06a7.85 7.85 0 00-6.4-5.33l-19.73-3-9-18.88a8 8 0 00-14.5 0l-8.86 19-1.17.21c0 .11.11.21.11.32a23.76 23.76 0 01-5.44 24.32L185.81 64l1.71 1.71-3.41 21A8.07 8.07 0 00192 96a8.33 8.33 0 004-1l17.49-9.81 17.6 9.6a8.2 8.2 0 008.53-.43 8.06 8.06 0 003.2-7.89l-3.52-21 14.51-14.92a8.09 8.09 0 001.81-8.13z"></path><path class="fill-primary" d="M100.18 106.67a8 8 0 01-7.91-9.25l4.61-28.8L77 48.37a8 8 0 014.46-13.51l27.09-4.22 12.11-26a8 8 0 017.2-4.64 8 8 0 017.23 4.58l12.29 25.9 27.12 4.05A8 8 0 01179.09 48l-19.78 20.38 4.8 28.77a8 8 0 01-11.74 8.34l-24.19-13.25-24.12 13.42a7.94 7.94 0 01-3.88 1z"></path><circle class="fill-secondary" cx="42.67" cy="160" r="21.33"></circle><path class="fill-secondary" d="M71.15 196.27A44.71 44.71 0 0053.34 232v2.67H8a8.06 8.06 0 01-8-8v-5.33A29.32 29.32 0 0129.33 192H56a29.13 29.13 0 0115.15 4.27z"></path><circle class="fill-secondary" cx="213.33" cy="160" r="21.33"></circle><path class="fill-secondary" d="M256 221.33v5.33a8.07 8.07 0 01-8 8h-45.33V232a44.69 44.69 0 00-17.81-35.73A29.07 29.07 0 01200 192h26.67A29.32 29.32 0 01256 221.33z"></path><circle class="fill-primary" cx="128" cy="154.67" r="32"></circle><path class="fill-primary" d="M157.33 202.67H98.66A29.35 29.35 0 0069.33 232v16a8 8 0 008 8h101.33a8 8 0 008-8v-16a29.35 29.35 0 00-29.33-29.33z"></path></svg>
               </div>
               <div>
                 <h4 class="!mb-1">Amazing Work Culture</h4>
@@ -666,7 +666,7 @@
           <!--/column -->
         </div>
         <!--/.row -->
-        <div class="text-center !mt-10"><a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Our Team</a></div>
+        <div class="text-center !mt-10"><a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Our Team</a></div>
       </div>
       <!-- /.container -->
     </section>
@@ -675,7 +675,7 @@
       <div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
         <div class="flex flex-wrap mx-[-15px] xl:!mt-[-22.5rem] lg:!mt-[-22.5rem] md:!mt-[-22.5rem] !relative">
           <div class="md:w-10/12 md:!ml-[8.33333333%] lg:w-8/12 lg:!ml-[16.66666667%] xl:w-8/12 xl:!ml-[16.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-            <h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3">Happy Team</h2>
+            <h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3">Happy Team</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-10 xl:!px-10 xxl:!px-20">Don't take our word for it. See what our team members say about us.</h3>
           </div>
           <!-- /column -->
@@ -815,7 +815,7 @@
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
-            <h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3">Job Positions</h2>
+            <h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3">Job Positions</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-10 xxl:!px-20">We’re always searching for amazing people to join our team. Take a look at our current openings.</h3>
           </div>
           <!-- /column -->
@@ -829,7 +829,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(226,98,107)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">SD</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Senior Graphic Designer</h4>
                   <p class="!mb-0 !text-[#60697b]">San Francisco, US</p>
                 </div>
@@ -859,7 +859,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(250,183,88)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">AN</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Multimedia Artist &amp; Animator</h4>
                   <p class="!mb-0 !text-[#60697b]">Birmingham, UK</p>
                 </div>
@@ -889,7 +889,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] bg-[rgba(247,139,119)] opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">MD</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">Mobile Developer</h4>
                   <p class="!mb-0 !text-[#60697b]">San Francisco, US</p>
                 </div>
@@ -904,7 +904,7 @@
                   <span class=" flex items-center justify-center font-bold !leading-[1.7] !tracking-[-0.01rem] rounded-[100%] !bg-[rgba(209,107,134)] !opacity-100 !text-white !w-[3rem] !h-[3rem] text-[1rem] !mr-4">ND</span>
                 </div>
                 <div>
-                  <span class="badge bg-[#e0e9fa] !text-[#3f78e0] rounded py-1 !mb-2">Full Time</span>
+                  <span class="badge bg-[#e0e9fa] !text-[#e31e24] rounded py-1 !mb-2">Full Time</span>
                   <h4 class="!mb-1">.NET Developer</h4>
                   <p class="!mb-0 !text-[#60697b]">Manchester, UK</p>
                 </div>
@@ -918,7 +918,7 @@
           <div class="lg:w-6/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35] !mb-3">Can't find the right position?</h2>
             <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-5 xl:!px-3 lg:!px-3 md:!px-24">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Get in Touch</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Get in Touch</a>
           </div>
           <!-- /column -->
         </div>
@@ -931,7 +931,7 @@
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="lg:w-11/12 xl:w-11/12 xxl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-            <h2 class="!text-[.75rem] uppercase !text-[#3f78e0] !tracking-[0.02rem] !leading-[1.35] !mb-3">FAQ</h2>
+            <h2 class="!text-[.75rem] uppercase !text-[#e31e24] !tracking-[0.02rem] !leading-[1.35] !mb-3">FAQ</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-10 lg:!px-14 xl:!px-10 xxl:!px-20">If you don't see an answer to your question, you can send us an email from our contact form.</h3>
           </div>
           <!--/column -->
@@ -942,7 +942,7 @@
             <div id="accordion-3" class="accordion-wrapper">
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-1">
-                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#3f78e0] before:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
+                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-1" class="collapse" aria-labelledby="accordion-heading-3-1" data-bs-target="#accordion-3">
@@ -956,7 +956,7 @@
               <!-- /.card -->
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-2">
-                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#3f78e0] before:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
+                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-2" class="collapse" aria-labelledby="accordion-heading-3-2" data-bs-target="#accordion-3">
@@ -970,7 +970,7 @@
               <!-- /.card -->
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-3">
-                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#3f78e0] before:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
+                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-3" class="collapse" aria-labelledby="accordion-heading-3-3" data-bs-target="#accordion-3">
@@ -984,7 +984,7 @@
               <!-- /.card -->
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-4">
-                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#3f78e0] before:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
+                  <button class="text-[#343f52] !text-[0.9rem] hover:!text-[#e31e24] before:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-4" class="collapse" aria-labelledby="accordion-heading-3-4" data-bs-target="#accordion-3">
@@ -1031,7 +1031,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1040,11 +1040,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1062,7 +1062,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1085,9 +1085,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/career2.html b/public/html/career2.html
index c33bbfa..92402b0 100644
--- a/public/html/career2.html
+++ b/public/html/career2.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -563,7 +563,7 @@
           <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-5">
             <h1 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.3]">Join Our Team</h1>
             <h3 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-6">Join our team to help shape the future of development.</h3>
-            <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Explore Positions</a>
+            <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Explore Positions</a>
           </div>
           <!-- /column -->
         </div>
@@ -585,7 +585,7 @@
           <div class="md:w-6/12 lg:w-6/12 xl:w-3/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
             <div class="card lift">
               <div class="card-body p-[40px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.1 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/target.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mb-3"><path class="fill-secondary" d="M178.66 79.37L166.93 91.1a76.68 76.68 0 014.91 11.52 85.77 85.77 0 0114.93-1.28h1.39a93.65 93.65 0 00-9.5-21.97zM0 128a96.1 96.1 0 00109.65 95 82.93 82.93 0 01-5.65-15.42 67 67 0 01-8 .43A80 80 0 0196 48a79 79 0 0137 9.17l11.73-11.73A94.73 94.73 0 0096 32a96.14 96.14 0 00-96 96z"></path><path class="fill-secondary" d="M37.33 128A58.78 58.78 0 0096 186.68a47.26 47.26 0 005.44-.32A82.71 82.71 0 01103 170a37.32 37.32 0 01-7 .64 42.67 42.67 0 010-85.34 32.88 32.88 0 018 .84l12.91-12.91a57 57 0 00-20.91-4A58.81 58.81 0 0037.33 128z"></path><path class="fill-secondary" d="M96 106.68A21.33 21.33 0 10117.33 128 21.39 21.39 0 0096 106.68zm0 26.66a5.33 5.33 0 115.33-5.33 5.28 5.28 0 01-5.33 5.33z"></path><path class="fill-primary" d="M96.1 136a8 8 0 01-5.67-13.65L159.76 53a8 8 0 0111.31 11.31l-69.33 69.33A8 8 0 0196.1 136z"></path><path class="fill-primary" d="M194.77 64H168.1a8 8 0 01-8-8V29.34a8.08 8.08 0 012.33-5.67l21.33-21.33A8 8 0 01197.42 8v18.68h18.68a8 8 0 015.66 13.66l-21.33 21.33a8 8 0 01-5.66 2.33zm-8 53.34a69.34 69.34 0 1069.33 69.34 69.4 69.4 0 00-69.33-69.34zm29.87 56.11L182 210.78a8 8 0 01-11.09.64l-18.67-16a8 8 0 1110.41-12.15l12.84 11 29.44-31.69a8 8 0 0111.74 10.88z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.1 256.01" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/target.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mb-3"><path class="fill-secondary" d="M178.66 79.37L166.93 91.1a76.68 76.68 0 014.91 11.52 85.77 85.77 0 0114.93-1.28h1.39a93.65 93.65 0 00-9.5-21.97zM0 128a96.1 96.1 0 00109.65 95 82.93 82.93 0 01-5.65-15.42 67 67 0 01-8 .43A80 80 0 0196 48a79 79 0 0137 9.17l11.73-11.73A94.73 94.73 0 0096 32a96.14 96.14 0 00-96 96z"></path><path class="fill-secondary" d="M37.33 128A58.78 58.78 0 0096 186.68a47.26 47.26 0 005.44-.32A82.71 82.71 0 01103 170a37.32 37.32 0 01-7 .64 42.67 42.67 0 010-85.34 32.88 32.88 0 018 .84l12.91-12.91a57 57 0 00-20.91-4A58.81 58.81 0 0037.33 128z"></path><path class="fill-secondary" d="M96 106.68A21.33 21.33 0 10117.33 128 21.39 21.39 0 0096 106.68zm0 26.66a5.33 5.33 0 115.33-5.33 5.28 5.28 0 01-5.33 5.33z"></path><path class="fill-primary" d="M96.1 136a8 8 0 01-5.67-13.65L159.76 53a8 8 0 0111.31 11.31l-69.33 69.33A8 8 0 0196.1 136z"></path><path class="fill-primary" d="M194.77 64H168.1a8 8 0 01-8-8V29.34a8.08 8.08 0 012.33-5.67l21.33-21.33A8 8 0 01197.42 8v18.68h18.68a8 8 0 015.66 13.66l-21.33 21.33a8 8 0 01-5.66 2.33zm-8 53.34a69.34 69.34 0 1069.33 69.34 69.4 69.4 0 00-69.33-69.34zm29.87 56.11L182 210.78a8 8 0 01-11.09.64l-18.67-16a8 8 0 1110.41-12.15l12.84 11 29.44-31.69a8 8 0 0111.74 10.88z"></path></svg>
                 <h4>Career Growth</h4>
                 <p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.</p>
               </div>
@@ -597,7 +597,7 @@
           <div class="md:w-6/12 lg:w-6/12 xl:w-3/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
             <div class="card lift">
               <div class="card-body p-[40px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/videocall.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mb-3"><g data-name="Layer 2"><path class="fill-secondary" d="M256 21.33v160a21.39 21.39 0 01-21.33 21.33H186a55.9 55.9 0 00-55.36-48H128V149a63.52 63.52 0 0016-22.08v27.73h96V29.33A13.33 13.33 0 00226.67 16h-69.33A13.33 13.33 0 00144 29.33v46.72a62.68 62.68 0 00-16-22.19V21.33A21.39 21.39 0 01149.33 0h85.33A21.4 21.4 0 01256 21.33z"></path><path class="fill-secondary" d="M192 85.33a16 16 0 1116-16 16 16 0 01-16 16zM216 128h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-primary" d="M162.67 256H8a8 8 0 01-8-8v-37.33a40 40 0 0140-40h90.67a40 40 0 0140 40V248a8 8 0 01-8 8zM38.4 91.73a1.8 1.8 0 01.11-.75 48 48 0 0193.76.32c0 .11.11.32.11.43s-.32.11-.43.11C114 96.64 102.4 77.12 102 76.27a5.32 5.32 0 00-3.84-2.56 5.42 5.42 0 00-4.48 1.39c-22.62 21-52.81 17-55.26 16.63z"></path><path class="fill-primary" d="M126.08 103.25c-14.4 0-24.64-10-29.76-16.43-24.32 19.08-53 16.32-58.88 15.56a21.89 21.89 0 00.21 4.6 48 48 0 0095.36-.32 18.89 18.89 0 00.21-4.28 26.93 26.93 0 01-7.14.87z"></path></g></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/videocall.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mb-3"><g data-name="Layer 2"><path class="fill-secondary" d="M256 21.33v160a21.39 21.39 0 01-21.33 21.33H186a55.9 55.9 0 00-55.36-48H128V149a63.52 63.52 0 0016-22.08v27.73h96V29.33A13.33 13.33 0 00226.67 16h-69.33A13.33 13.33 0 00144 29.33v46.72a62.68 62.68 0 00-16-22.19V21.33A21.39 21.39 0 01149.33 0h85.33A21.4 21.4 0 01256 21.33z"></path><path class="fill-secondary" d="M192 85.33a16 16 0 1116-16 16 16 0 01-16 16zM216 128h-48a8 8 0 01-8-8 24 24 0 0124-24h16a24 24 0 0124 24 8 8 0 01-8 8z"></path><path class="fill-primary" d="M162.67 256H8a8 8 0 01-8-8v-37.33a40 40 0 0140-40h90.67a40 40 0 0140 40V248a8 8 0 01-8 8zM38.4 91.73a1.8 1.8 0 01.11-.75 48 48 0 0193.76.32c0 .11.11.32.11.43s-.32.11-.43.11C114 96.64 102.4 77.12 102 76.27a5.32 5.32 0 00-3.84-2.56 5.42 5.42 0 00-4.48 1.39c-22.62 21-52.81 17-55.26 16.63z"></path><path class="fill-primary" d="M126.08 103.25c-14.4 0-24.64-10-29.76-16.43-24.32 19.08-53 16.32-58.88 15.56a21.89 21.89 0 00.21 4.6 48 48 0 0095.36-.32 18.89 18.89 0 00.21-4.28 26.93 26.93 0 01-7.14.87z"></path></g></svg>
                 <h4>Work From Anywhere</h4>
                 <p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.</p>
               </div>
@@ -609,7 +609,7 @@
           <div class="md:w-6/12 lg:w-6/12 xl:w-3/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
             <div class="card lift">
               <div class="card-body p-[40px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/wallet.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mb-3"><path class="fill-secondary" d="M184.21 42.75L161.57 4a8 8 0 00-4.91-3.76 8.1 8.1 0 00-6.12.9L81.31 42.66z"></path><path class="fill-primary" d="M32 53.33A10.67 10.67 0 0132 32h36l35.63-21.33H32A32 32 0 00.53 37.33 10.9 10.9 0 000 40v162.67a32.09 32.09 0 0032 32h181.33a21.39 21.39 0 0021.33-21.32V192H208a48 48 0 110-96h26.67V74.69a21.39 21.39 0 00-21.33-21.33H32zM202.67 32a21.3 21.3 0 00-18.45-21.12l18.45 31.79z"></path><path class="fill-secondary" d="M248 112h-40a32 32 0 000 64h40a8 8 0 008-8v-48a8 8 0 00-8-8zm-40 42.66A10.67 10.67 0 11218.67 144 10.68 10.68 0 01208 154.66z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.67" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/wallet.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mb-3"><path class="fill-secondary" d="M184.21 42.75L161.57 4a8 8 0 00-4.91-3.76 8.1 8.1 0 00-6.12.9L81.31 42.66z"></path><path class="fill-primary" d="M32 53.33A10.67 10.67 0 0132 32h36l35.63-21.33H32A32 32 0 00.53 37.33 10.9 10.9 0 000 40v162.67a32.09 32.09 0 0032 32h181.33a21.39 21.39 0 0021.33-21.32V192H208a48 48 0 110-96h26.67V74.69a21.39 21.39 0 00-21.33-21.33H32zM202.67 32a21.3 21.3 0 00-18.45-21.12l18.45 31.79z"></path><path class="fill-secondary" d="M248 112h-40a32 32 0 000 64h40a8 8 0 008-8v-48a8 8 0 00-8-8zm-40 42.66A10.67 10.67 0 11218.67 144 10.68 10.68 0 01208 154.66z"></path></svg>
                 <h4>Smart Salary</h4>
                 <p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.</p>
               </div>
@@ -621,7 +621,7 @@
           <div class="md:w-6/12 lg:w-6/12 xl:w-3/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !mt-[25px]">
             <div class="card lift">
               <div class="card-body p-[40px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/alarm.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#3f78e0]  !mb-3"><path class="fill-secondary" d="M26.64 256a10.66 10.66 0 01-8.26-17.4l23.33-28.67a10.67 10.67 0 1116.55 13.47l-23.33 28.67a10.65 10.65 0 01-8.29 3.93zm202.69 0a10.65 10.65 0 01-8.29-3.93l-23.33-28.67a10.67 10.67 0 0116.55-13.47l23.32 28.67a10.66 10.66 0 01-8.25 17.4zM10.66 72a10.66 10.66 0 01-7.54-18.2L53.79 3.13a10.67 10.67 0 0115.09 15.08L18.21 68.88A10.68 10.68 0 0110.66 72zm234.65 0a10.55 10.55 0 01-7.53-3.12L187.1 18.21a10.67 10.67 0 1115.09-15.08l50.67 50.67a10.66 10.66 0 01-7.55 18.2z"></path><path class="fill-primary" d="M128 32a112 112 0 10112 112A112.12 112.12 0 00128 32zm66.68 122.68H128A10.68 10.68 0 01117.31 144V80a10.68 10.68 0 0121.35 0v53.33h56a10.68 10.68 0 010 21.35z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/alarm.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  solid-mono text-[#e31e24]  !mb-3"><path class="fill-secondary" d="M26.64 256a10.66 10.66 0 01-8.26-17.4l23.33-28.67a10.67 10.67 0 1116.55 13.47l-23.33 28.67a10.65 10.65 0 01-8.29 3.93zm202.69 0a10.65 10.65 0 01-8.29-3.93l-23.33-28.67a10.67 10.67 0 0116.55-13.47l23.32 28.67a10.66 10.66 0 01-8.25 17.4zM10.66 72a10.66 10.66 0 01-7.54-18.2L53.79 3.13a10.67 10.67 0 0115.09 15.08L18.21 68.88A10.68 10.68 0 0110.66 72zm234.65 0a10.55 10.55 0 01-7.53-3.12L187.1 18.21a10.67 10.67 0 1115.09-15.08l50.67 50.67a10.66 10.66 0 01-7.55 18.2z"></path><path class="fill-primary" d="M128 32a112 112 0 10112 112A112.12 112.12 0 00128 32zm66.68 122.68H128A10.68 10.68 0 01117.31 144V80a10.68 10.68 0 0121.35 0v53.33h56a10.68 10.68 0 010 21.35z"></path></svg>
                 <h4>Flexible Hours</h4>
                 <p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.</p>
               </div>
@@ -659,7 +659,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px]">
                 <div class="flex flex-row">
                   <div>
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/share.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem]  solid-mono text-[#3f78e0]  !mr-4"><g data-name="Layer 2"><path class="fill-secondary" d="M219.1 108.48v7.68A11.89 11.89 0 01207.15 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zm26.24-60.8a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23h-44.06a20 20 0 00-7.79-12.69 47.13 47.13 0 01-18.24-38.4C149.86 21.34 171.09.33 196.58 0a47.34 47.34 0 0134.56 13.88 46.83 46.83 0 0114.2 33.79z"></path><path class="fill-primary" d="M5.25 117.34A5.34 5.34 0 000 122.67v98.64A2.68 2.68 0 002.67 224H28a5.33 5.33 0 005.13-3.87l23.6-83.18A10.66 10.66 0 0050.1 124c-9.67-3.52-24.5-7-44.85-6.66zM234.67 176c-21.33 0-64 27-85.33 27S104 186.65 104 186.65s28.74 5.35 45.33 5.35 21.33-5.66 21.33-13.33c0-18.67-31.72-21.56-47.75-24-15.74-8.76-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.5c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33S245.33 176 234.67 176z"></path></g></svg>
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 255.98 245.34" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/share.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem]  solid-mono text-[#e31e24]  !mr-4"><g data-name="Layer 2"><path class="fill-secondary" d="M219.1 108.48v7.68A11.89 11.89 0 01207.15 128h-19.63c-5.76 0-12-4.27-12-13.76v-5.76zm26.24-60.8a47.26 47.26 0 01-17.6 36.91 22.89 22.89 0 00-8.32 13.23h-44.06a20 20 0 00-7.79-12.69 47.13 47.13 0 01-18.24-38.4C149.86 21.34 171.09.33 196.58 0a47.34 47.34 0 0134.56 13.88 46.83 46.83 0 0114.2 33.79z"></path><path class="fill-primary" d="M5.25 117.34A5.34 5.34 0 000 122.67v98.64A2.68 2.68 0 002.67 224H28a5.33 5.33 0 005.13-3.87l23.6-83.18A10.66 10.66 0 0050.1 124c-9.67-3.52-24.5-7-44.85-6.66zM234.67 176c-21.33 0-64 27-85.33 27S104 186.65 104 186.65s28.74 5.35 45.33 5.35 21.33-5.66 21.33-13.33c0-18.67-31.72-21.56-47.75-24-15.74-8.76-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.5c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33S245.33 176 234.67 176z"></path></g></svg>
                   </div>
                   <div>
                     <h4 class="!mb-1">Our Mission</h4>
@@ -671,7 +671,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[40px]">
                 <div class="flex flex-row">
                   <div>
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.72" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/partnership.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem]  solid-mono text-[#3f78e0]  !mr-4"><g data-name="Layer 2"><path class="fill-primary" d="M5.25 106.72A5.34 5.34 0 000 112.05v98.64a2.68 2.68 0 002.67 2.67H28a5.33 5.33 0 005.13-3.87L56.7 126.3a10.66 10.66 0 00-6.6-12.92c-9.67-3.52-24.5-7-44.85-6.66zm229.42 58.64c-21.33 0-64 27-85.33 27S104 176 104 176s28.74 5.33 45.33 5.33 21.33-5.66 21.33-13.33c0-18.67-31.72-21.57-47.75-24-15.74-8.77-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.55c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33s-10.65-16-21.31-16z"></path><path class="fill-secondary" d="M250.75 128a5.34 5.34 0 005.25-5.33V24a2.68 2.68 0 00-2.67-2.67H228a5.33 5.33 0 00-5.13 3.87l-23.6 83.19a10.66 10.66 0 006.6 12.92c9.7 3.55 24.53 7.04 44.88 6.69zM21.33 69.36c21.33 0 64-27 85.33-27S152 58.69 152 58.69s-28.72-5.33-45.31-5.33S85.34 59 85.34 66.69c0 18.67 31.72 21.57 47.75 24 15.74 8.77 23.92 15.69 50 17.9a28.85 28.85 0 01.81-4.54l21.43-75.52C181.06 17.49 139.28 0 117.34 0 85.33 0 0 42.69 0 53.36s10.67 16 21.33 16z"></path></g></svg>
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256 234.72" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/partnership.svg" class="svg-inject icon-svg !w-[1.8rem] !h-[1.8rem]  solid-mono text-[#e31e24]  !mr-4"><g data-name="Layer 2"><path class="fill-primary" d="M5.25 106.72A5.34 5.34 0 000 112.05v98.64a2.68 2.68 0 002.67 2.67H28a5.33 5.33 0 005.13-3.87L56.7 126.3a10.66 10.66 0 00-6.6-12.92c-9.67-3.52-24.5-7-44.85-6.66zm229.42 58.64c-21.33 0-64 27-85.33 27S104 176 104 176s28.74 5.33 45.33 5.33 21.33-5.66 21.33-13.33c0-18.67-31.72-21.57-47.75-24-15.74-8.77-23.92-15.69-50-17.9a28.85 28.85 0 01-.81 4.54l-21.43 75.55c24.27 11 66.05 28.53 88 28.53 32 0 117.32-42.67 117.32-53.33s-10.65-16-21.31-16z"></path><path class="fill-secondary" d="M250.75 128a5.34 5.34 0 005.25-5.33V24a2.68 2.68 0 00-2.67-2.67H228a5.33 5.33 0 00-5.13 3.87l-23.6 83.19a10.66 10.66 0 006.6 12.92c9.7 3.55 24.53 7.04 44.88 6.69zM21.33 69.36c21.33 0 64-27 85.33-27S152 58.69 152 58.69s-28.72-5.33-45.31-5.33S85.34 59 85.34 66.69c0 18.67 31.72 21.57 47.75 24 15.74 8.77 23.92 15.69 50 17.9a28.85 28.85 0 01.81-4.54l21.43-75.52C181.06 17.49 139.28 0 117.34 0 85.33 0 0 42.69 0 53.36s10.67 16 21.33 16z"></path></g></svg>
                   </div>
                   <div>
                     <h4 class="!mb-1">Our Values</h4>
@@ -862,7 +862,7 @@
           <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">Can't find the right position?</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-7 lg:!px-5 xl:!px-0 xxl:!px-5">We are a community with 5000+ team members. Join and build the future with us.</h3>
-            <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Contact Us</a>
+            <a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Contact Us</a>
           </div>
           <!-- /column -->
         </div>
@@ -896,7 +896,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -905,11 +905,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -927,7 +927,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -950,9 +950,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/contact.html b/public/html/contact.html
index 431a0a5..953ee0c 100644
--- a/public/html/contact.html
+++ b/public/html/contact.html
@@ -537,9 +537,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle hover:!text-[#ffffffb3]" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
@@ -595,7 +595,7 @@
                   <div class="p-10 xl:!p-[4.5rem] lg:!p-[4.5rem] md:!p-12">
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                       </div>
                       <div class="!self-start !justify-start">
                         <h5 class="!mb-1">Address</h5>
@@ -605,7 +605,7 @@
                     <!--/div -->
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                       </div>
                       <div>
                         <h5 class="!mb-1">Phone</h5>
@@ -615,7 +615,7 @@
                     <!--/div -->
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
                       </div>
                       <div>
                         <h5 class="!mb-1">E-mail</h5>
@@ -693,7 +693,7 @@
                 </div>
                 <!-- /column -->
                 <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center">
-                  <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
+                  <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
                   <p class="!text-[#aab0bc]"><strong>*</strong> These fields are required.</p>
                 </div>
                 <!-- /column -->
@@ -722,17 +722,17 @@
           <div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">7518</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">7518</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">5472</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">5472</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">2184</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">2184</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Expert Employees</p>
               </div>
               <!--/column -->
@@ -771,7 +771,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -780,11 +780,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -802,7 +802,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -825,9 +825,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/contact2.html b/public/html/contact2.html
index 8a27610..b73b14e 100644
--- a/public/html/contact2.html
+++ b/public/html/contact2.html
@@ -541,13 +541,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -569,7 +569,7 @@
             <h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3 !text-[#343f52]">Get in Touch</h1>
             <nav class="inline-block" aria-label="breadcrumb">
               <ol class="breadcrumb  flex flex-wrap bg-[none] p-0 !rounded-none list-none !mb-[20px]">
-                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
                 <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Contact</li>
               </ol>
             </nav>
@@ -586,7 +586,7 @@
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] !mb-24 items-center">
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
+            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full">
                 <figure class="rounded-[0.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[0.4rem]" src="../assets/img/photos/g5.jpg" alt="image"></figure>
@@ -621,7 +621,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-8">Convinced yet? Let's make something great together.</h2>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Address</h5>
@@ -630,7 +630,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Phone</h5>
@@ -639,7 +639,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">E-mail</h5>
@@ -707,7 +707,7 @@
                 </div>
                 <!-- /column -->
                 <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center">
-                  <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
+                  <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
                   <p class="!text-[#aab0bc]"><strong>*</strong> These fields are required.</p>
                 </div>
                 <!-- /column -->
@@ -748,7 +748,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -757,11 +757,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -779,7 +779,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -802,9 +802,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/contact3.html b/public/html/contact3.html
index f2292c7..962fb73 100644
--- a/public/html/contact3.html
+++ b/public/html/contact3.html
@@ -537,9 +537,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle hover:!text-[#ffffffb3]" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
@@ -586,7 +586,7 @@
                     <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
                     <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are trusted by over 5000+ clients. Join them by using our services and grow your business.</p>
                     <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
                   </div>
                   <!--/div -->
                 </div>
@@ -664,7 +664,7 @@
                     </div>
                     <!-- /column -->
                     <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full">
-                      <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
+                      <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="Send message">
                       <p class="!text-[#aab0bc]"><strong>*</strong> These fields are required.</p>
                     </div>
                     <!-- /column -->
@@ -677,7 +677,7 @@
               <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
                 <div class="flex flex-row">
                   <div>
-                    <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                    <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                   </div>
                   <div>
                     <h5 class="!mb-1">Address</h5>
@@ -686,7 +686,7 @@
                 </div>
                 <div class="flex flex-row">
                   <div>
-                    <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                    <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                   </div>
                   <div>
                     <h5 class="!mb-1">Phone</h5>
@@ -695,7 +695,7 @@
                 </div>
                 <div class="flex flex-row">
                   <div>
-                    <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                    <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
                   </div>
                   <div>
                     <h5 class="!mb-1">E-mail</h5>
@@ -747,7 +747,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -756,11 +756,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -778,7 +778,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -801,9 +801,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/demo1.html b/public/html/demo1.html
index 07966f1..6dfc9b2 100644
--- a/public/html/demo1.html
+++ b/public/html/demo1.html
@@ -880,11 +880,11 @@
               <div class="card !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
                 <div class="card-body flex-[1_1_auto] p-[40px]">
                     <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5"
-                    class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#3f78e0] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"/><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"/><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"/><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"/><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"/></svg>
+                    class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#e31e24] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"/><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"/><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"/><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"/><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"/></svg>
                   <h4 class="!text-[1rem]">Content Marketing</h4>
                   <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget
                     metus cras justo.</p>
-                  <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                  <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
                 </div>
                 <!--/.card-body -->
               </div>
diff --git a/public/html/demo12.html b/public/html/demo12.html
index 61e178f..63943a6 100644
--- a/public/html/demo12.html
+++ b/public/html/demo12.html
@@ -740,7 +740,7 @@
                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 388.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/gift.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] !text-[#f78b77] text-blue !mb-3"><path class="lineal-fill" d="M251.1 258.8l-44.3-22.9c-1.3-.6-2.7-.6-4 0l-44.4 22.9c-2.1 1.1-4.7.3-5.8-1.9-.3-.6-.5-1.3-.5-2v-113l105.4.2v112.8c0 2.4-1.9 4.3-4.3 4.3-.8 0-1.5-.1-2.1-.4z"></path><path class="lineal-stroke" d="M253.1 270.7c-2.5 0-5-.6-7.2-1.8l-41.1-21.2-41.1 21.2c-2.2 1.2-4.7 1.8-7.2 1.8-8.7 0-15.8-7.1-15.8-15.8v-113c0-6.3 5.1-11.5 11.5-11.5l105.3.2c6.3 0 11.4 5.1 11.4 11.5v112.8c0 8.7-7.1 15.8-15.8 15.8zm-48.3-46.8c2.5 0 5 .6 7.2 1.8l34 17.6v-89.6l-82.4-.2v89.8l34-17.6c2.3-1.2 4.7-1.8 7.2-1.8z"></path><path class="lineal-stroke" d="M319.5 388.9H90.1c-29.6 0-53.6-24-53.6-53.6V142.1c0-6.3 5.1-11.5 11.5-11.5h313.8c6.3 0 11.5 5.1 11.5 11.5v25.5c.2 6.3-4.8 11.6-11.1 11.8-6.3.2-11.6-4.8-11.8-11.1v-14.7H59.3v181.7c0 17 13.8 30.7 30.7 30.7h229.5c17 0 30.7-13.8 30.7-30.7V228.8c0-6.3 5.1-11.5 11.5-11.5 6.3 0 11.5 5.1 11.5 11.5v106.4c-.1 29.7-24.1 53.6-53.7 53.7z"></path><path class="lineal-fill" d="M356.5 142.1H53.2c-23 0-41.7-18.7-41.7-41.7 0-23 18.7-41.7 41.7-41.7h303.3c23 0 41.7 18.7 41.7 41.7-.1 23-18.7 41.7-41.7 41.7z"></path><path class="lineal-stroke" d="M356.5 153.5H53.2C23.8 153.5 0 129.7 0 100.4s23.8-53.2 53.2-53.2h303.3c29.4 0 53.1 23.8 53.1 53.2s-23.8 53.1-53.1 53.1zM53.2 70.1c-16.7-.3-30.5 13-30.8 29.7s13 30.5 29.7 30.8h304.4c16.7.3 30.5-13 30.8-29.7.3-16.7-13-30.5-29.7-30.8H53.2z"></path><path class="lineal-fill" d="M203.2 58.7c-5.8-31.3-35.8-52-67.1-46.3-23.5 4.3-42 22.7-46.3 46.3h113.4z"></path><path class="lineal-stroke" d="M203.2 70.1H89.8c-6.3 0-11.5-5.1-11.4-11.5 0-.7.1-1.3.2-2C85.4 19 121.4-5.9 158.9 1c28.3 5.2 50.4 27.3 55.6 55.6 1.1 6.2-3 12.2-9.2 13.3-.7.1-1.4.2-2.1.2zm-97.4-22.9h81.4c-12.1-22.5-40.2-30.9-62.6-18.8-8 4.3-14.5 10.9-18.8 18.8z"></path><path class="lineal-fill" d="M319.8 58.7c-5.8-31.3-35.8-52-67.1-46.3-23.5 4.3-42 22.7-46.3 46.3h113.4z"></path><path class="lineal-stroke" d="M319.8 70.1H206.4c-6.3 0-11.4-5.1-11.4-11.4 0-.7.1-1.4.2-2C201.9 19 237.9-5.9 275.5 1c28.3 5.2 50.4 27.3 55.6 55.6 1.1 6.2-3 12.2-9.3 13.3-.6.1-1.3.2-2 .2zm-97.4-22.9h81.4c-12.1-22.5-40.2-30.9-62.6-18.8-8 4.3-14.5 10.9-18.8 18.8z"></path></svg>
                 <h4>Product Design</h4>
                 <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus cras justo.</p>
-                <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+                <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
               </div>
               <!--/.card-body -->
             </div>
diff --git a/public/html/demo15.html b/public/html/demo15.html
index bd60267..0ea8f3d 100644
--- a/public/html/demo15.html
+++ b/public/html/demo15.html
@@ -255,54 +255,54 @@
                 <li class="nav-item dropdown">
                   <a class="nav-link dropdown-toggle  font-bold !tracking-[-0.01rem]" href="#" data-bs-toggle="dropdown">Pages</a>
                   <ul class="dropdown-menu">
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='services.html'>Services I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='services2.html'>Services II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='services.html'>Services I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='services2.html'>Services II</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='about.html'>About I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='about2.html'>About II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='about.html'>About I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='about2.html'>About II</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop.html'>Shop I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop2.html'>Shop II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop-product.html'>Product Page</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop-cart.html'>Shopping Cart</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop-checkout.html'>Checkout</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop.html'>Shop I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop2.html'>Shop II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-product.html'>Product Page</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-cart.html'>Shopping Cart</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-checkout.html'>Checkout</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='contact.html'>Contact I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='contact2.html'>Contact II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='contact3.html'>Contact III</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact.html'>Contact I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact2.html'>Contact II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact3.html'>Contact III</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='career.html'>Job Listing I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='career2.html'>Job Listing II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='career-job.html'>Job Description</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career.html'>Job Listing I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career2.html'>Job Listing II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career-job.html'>Job Description</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='404.html'>404 Not Found</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='page-loader.html'>Page Loader</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signin.html'>Sign In I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signin2.html'>Sign In II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signup.html'>Sign Up I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signup2.html'>Sign Up II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='terms.html'>Terms</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='404.html'>404 Not Found</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='page-loader.html'>Page Loader</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signin.html'>Sign In I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signin2.html'>Sign In II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signup.html'>Sign Up I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signup2.html'>Sign Up II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='terms.html'>Terms</a></li>
                       </ul>
                     </li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='pricing.html'>Pricing</a></li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='onepage.html'>One Page</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='pricing.html'>Pricing</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='onepage.html'>One Page</a></li>
                   </ul>
                 </li>
                 <li class="nav-item dropdown">
@@ -310,22 +310,22 @@
                   <div class="dropdown-menu dropdown-lg">
                     <div class="dropdown-lg-content">
                       <div>
-                        <h6 class="dropdown-header !text-[#3f78e0]">Project Pages</h6>
+                        <h6 class="dropdown-header !text-[#e31e24]">Project Pages</h6>
                         <ul class="pl-0 list-none">
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects.html'>Projects I</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects2.html'>Projects II</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects3.html'>Projects III</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects4.html'>Projects IV</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects.html'>Projects I</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects2.html'>Projects II</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects3.html'>Projects III</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects4.html'>Projects IV</a></li>
                         </ul>
                       </div>
                       <!-- /.column -->
                       <div>
-                        <h6 class="dropdown-header !text-[#3f78e0]">Single Projects</h6>
+                        <h6 class="dropdown-header !text-[#e31e24]">Single Projects</h6>
                         <ul class="pl-0 list-none">
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project.html'>Single Project I</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project2.html'>Single Project II</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project3.html'>Single Project III</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project4.html'>Single Project IV</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project.html'>Single Project I</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project2.html'>Single Project II</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project3.html'>Single Project III</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project4.html'>Single Project IV</a></li>
                         </ul>
                       </div>
                       <!-- /.column -->
@@ -336,14 +336,14 @@
                 <li class="nav-item dropdown">
                   <a class="nav-link dropdown-toggle  font-bold !tracking-[-0.01rem]" href="#" data-bs-toggle="dropdown">Blog</a>
                   <ul class="dropdown-menu">
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog.html'>Blog without Sidebar</a></li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog2.html'>Blog with Sidebar</a></li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog3.html'>Blog with Left Sidebar</a></li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog.html'>Blog without Sidebar</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog2.html'>Blog with Sidebar</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog3.html'>Blog with Left Sidebar</a></li>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog-post.html'>Post without Sidebar</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog-post2.html'>Post with Sidebar</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog-post3.html'>Post with Left Sidebar</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post.html'>Post without Sidebar</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post2.html'>Post with Sidebar</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post3.html'>Post with Left Sidebar</a></li>
                       </ul>
                     </li>
                   </ul>
@@ -451,56 +451,56 @@
                     <li class="mega-menu-content">
                       <div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
                         <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
-                          <h6 class="dropdown-header !text-[#3f78e0]">Usage</h6>
+                          <h6 class="dropdown-header !text-[#e31e24]">Usage</h6>
                           <ul class="pl-0 list-none  xl:columns-2 lg:columns-2  xl:pb-1 lg:pb-1">
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/index.html'>Get Started</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/forms.html'>Forms</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/faq.html'>FAQ</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/changelog.html'>Changelog</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/credits.html'>Credits</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/index.html'>Get Started</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/forms.html'>Forms</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/faq.html'>FAQ</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/changelog.html'>Changelog</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/credits.html'>Credits</a></li>
                           </ul>
-                          <h6 class="dropdown-header !text-[#3f78e0] xl:!mt-6 lg:!mt-6">Styleguide</h6>
+                          <h6 class="dropdown-header !text-[#e31e24] xl:!mt-6 lg:!mt-6">Styleguide</h6>
                           <ul class="pl-0 list-none  xl:columns-2 lg:columns-2 ">
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/colors.html'>Colors</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/fonts.html'>Fonts</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/misc.html'>Misc</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/colors.html'>Colors</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/fonts.html'>Fonts</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/misc.html'>Misc</a></li>
                           </ul>
                         </div>
                         <!--/column -->
                         <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
-                          <h6 class="dropdown-header !text-[#3f78e0]">Elements</h6>
+                          <h6 class="dropdown-header !text-[#e31e24]">Elements</h6>
                           <ul class="pl-0 list-none  xl:columns-3 lg:columns-3 ">
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/accordion.html'>Accordion</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/alerts.html'>Alerts</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/animations.html'>Animations</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/avatars.html'>Avatars</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/background.html'>Background</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/badges.html'>Badges</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/buttons.html'>Buttons</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/card.html'>Card</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/carousel.html'>Carousel</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/dividers.html'>Dividers</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/form-elements.html'>Form Elements</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/image-hover.html'>Image Hover</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/image-mask.html'>Image Mask</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/lightbox.html'>Lightbox</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/player.html'>Media Player</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/modal.html'>Modal</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/pagination.html'>Pagination</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/progressbar.html'>Progressbar</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/shadows.html'>Shadows</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/shapes.html'>Shapes</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tables.html'>Tables</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tabs.html'>Tabs</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/text-animations.html'>Text Animations</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tiles.html'>Tiles</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/typography.html'>Typography</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/accordion.html'>Accordion</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/alerts.html'>Alerts</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/animations.html'>Animations</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/avatars.html'>Avatars</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/background.html'>Background</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/badges.html'>Badges</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/buttons.html'>Buttons</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/card.html'>Card</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/carousel.html'>Carousel</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/dividers.html'>Dividers</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/form-elements.html'>Form Elements</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/image-hover.html'>Image Hover</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/image-mask.html'>Image Mask</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/lightbox.html'>Lightbox</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/player.html'>Media Player</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/modal.html'>Modal</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/pagination.html'>Pagination</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/progressbar.html'>Progressbar</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/shadows.html'>Shadows</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/shapes.html'>Shapes</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tables.html'>Tables</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tabs.html'>Tabs</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/text-animations.html'>Text Animations</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tiles.html'>Tiles</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/typography.html'>Typography</a></li>
                           </ul>
                         </div>
                         <!--/column -->
@@ -561,16 +561,16 @@
           <div class="widget !mb-8">
             <h4 class="widget-title !text-white !mb-[0.75rem] !text-[.95rem] !leading-[1.45]">Contact Info</h4>
             <address class=" not-italic !leading-[inherit] !mb-[1rem]"> Moonshine St. 14/05 <br> Light City, London </address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
           <div class="widget !mb-8">
             <h4 class="widget-title !text-white !mb-[0.75rem] !text-[.95rem] !leading-[1.45]">Learn More</h4>
             <ul class="list-unstyled !pl-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Contact Us</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Contact Us</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -663,7 +663,7 @@
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] !mb-[4.5rem] xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem] items-center">
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative xl:!order-2 lg:!order-2">
-            <div class="shape bg-dot primary bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"></div>
+            <div class="shape bg-dot primary bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] rellax !w-[6rem] !h-[10rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 3rem; left: 5.5rem"></div>
             <div class="flex flex-wrap !relative overlap-grid-2">
               <div class="item xl:w-[70%] xl:z-[3] xl:ml-[30%] xl:!mt-0 lg:w-[70%] lg:z-[3] lg:ml-[30%] lg:!mt-0 md:w-[70%] md:z-[3] md:ml-[30%] md:!mt-0">
                 <figure class="!rounded-[.4rem] shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] relative"><img class="!rounded-[.4rem] " src="../assets/img/photos/about2.jpg" alt="image"></figure>
@@ -682,15 +682,15 @@
             <div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px]">
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
                 </ul>
               </div>
               <!--/column -->
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
               </div>
               <!--/column -->
@@ -762,7 +762,7 @@
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium xl:!pr-5 lg:!pr-5">Find out everything you need to know and more about how we create our business process models.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Etiam porta sem malesuada magna mollis euismod. Nullam id dolor id nibh ultricies vehicula ut id elit. Nullam quis risus eget urna mollis ornare.</p>
             <p class="!mb-6">Nullam id dolor id nibh ultricies vehicula ut id elit. Vestibulum id ligula porta felis euismod semper. Aenean lacinia bibendum nulla sed consectetur. Sed posuere consectetur est at lobortis. Vestibulum id ligula porta felis.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Learn More</a>
           </div>
           <!--/column -->
         </div>
@@ -999,25 +999,25 @@
           <div class="xl:w-10/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px] !text-center">
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/check.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M204.8 409.6C91.9 409.6 0 317.7 0 204.8c0-49.9 18.2-98.1 51.2-135.5 4.4-5 12-5.5 17-1.1s5.5 12 1.1 17c-29.1 33-45.2 75.5-45.2 119.5 0 99.6 81.1 180.7 180.7 180.7s180.7-81.1 180.7-180.7S304.4 24.1 204.8 24.1c-27.3-.1-54.2 6.1-78.7 18-6 2.9-13.2.4-16.1-5.6-2.9-6-.4-13.2 5.6-16.1C143.4 6.9 173.9-.1 204.8 0c112.9 0 204.8 91.9 204.8 204.8s-91.9 204.8-204.8 204.8z"></path><path class="lineal-fill" d="M349.4 204.8c0 79.8-64.7 144.6-144.6 144.6S60.2 284.6 60.2 204.8 125 60.2 204.8 60.2 349.4 125 349.4 204.8z"></path><path class="lineal-stroke" d="M204.8 361.4c-86.4 0-156.6-70.2-156.6-156.6S118.4 48.2 204.8 48.2s156.6 70.2 156.6 156.6-70.2 156.6-156.6 156.6zm0-289.1c-73.1 0-132.5 59.4-132.5 132.5s59.4 132.5 132.5 132.5 132.5-59.5 132.5-132.5S277.9 72.3 204.8 72.3z"></path><path class="lineal-stroke" d="M200.9 246.7c-8.8 0-17.2-3.5-23.5-9.7L145 204.5c-4.7-4.7-4.7-12.3 0-17s12.3-4.7 17 0l32.5 32.5c3.6 3.5 9.3 3.5 12.8 0l49.8-49.9c4.7-4.7 12.3-4.7 17 0s4.7 12.3 0 17L224.4 237c-6.2 6.2-14.7 9.7-23.5 9.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">7518</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 441.4 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/user.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-fill" d="M254.9 457c-14.9-8.1-24.1-23.7-24.1-40.6V285.6c26.5 11.1 57.1 4.9 77.1-15.6-19-26.2-49.3-41.6-81.6-41.6H115.7c-55.7 0-100.9 45.2-100.9 100.9v167.9h312.4v-.8L254.9 457z"></path><path class="lineal-stroke" d="M426.6 270.8c-8.2 0-14.8 6.6-14.9 14.8v130.7c0 11.5-6.3 22.1-16.4 27.6l-66.7 36.3-66.6-36.3c-10.1-5.5-16.4-16.1-16.4-27.6V305c4.1.6 8.2.9 12.3.9 1.3 0 2.5 0 3.8-.1h1c1.1-.1 2.2-.1 3.4-.2l1.6-.2 1.6-.2c15-2 29.3-8 41.1-17.5l1.1-.9 1.3-1.1c.9-.7 1.7-1.5 2.5-2.2l.4-.4c1-.9 1.9-1.8 2.8-2.7 3.8-3.9 7.2-8.1 10.1-12.6 7.2 10.9 16.8 19.9 28 26.5 7.1 4.1 16.2 1.8 20.3-5.3 4.1-7.1 1.8-16.2-5.3-20.3-10-5.9-17.9-14.8-22.6-25.5-2.4-5.4-7.7-8.8-13.6-8.9h-13.5c-5.9 0-11.2 3.5-13.6 8.9-.5 1-.9 2-1.4 3-12.8-12.4-28.4-21.7-45.4-27.2 17.4-16.5 27.2-39.4 27.2-63.3V87.5c-.2-8.2-7-14.7-15.2-14.5-7.9.2-14.3 6.6-14.5 14.5v68.3c0 31.6-25.5 57.4-57.1 57.8h-62c-31.6-.5-57-26.2-57-57.8V87.5c0-31.9 25.9-57.8 57.8-57.8h60.5c8.2-.2 14.7-7 14.5-15.2-.2-7.9-6.6-14.3-14.5-14.5h-60.5C92.5.1 53.3 39.2 53.3 87.5v68.3c0 23.9 9.8 46.8 27.2 63.3C32.6 234.5.1 279 0 329.3v167.9c0 8.2 6.6 14.8 14.8 14.8h313.9c2.5 0 4.9-.6 7.1-1.8l73.8-40.2c19.6-10.7 31.9-31.3 31.9-53.6V285.6c-.1-8.2-6.7-14.8-14.9-14.8zM29.7 482.3v-153c.1-47.5 38.5-85.9 86-86h40.4v144.1c0 8.2 6.6 14.8 14.8 14.8s14.8-6.6 14.8-14.8V243.3h40.4c22.6 0 44.3 9 60.4 24.8-6.3 3.9-13.3 6.4-20.6 7.5h.1c-1.1.2-2.3.3-3.5.4l-.6.1c-1.2.1-2.5.1-3.7.1h-.2c-7.3 0-14.6-1.4-21.4-4.3-7.5-3.2-16.3.3-19.4 7.9-.8 1.8-1.2 3.8-1.2 5.8v130.7c0 22.4 12.2 42.9 31.8 53.7l22.6 12.3H29.7z"></path><path class="lineal-stroke" d="M327.2 405.9c-2.5 0-5-.6-7.2-1.9l-24.9-13.9c-7.2-4-9.7-13-5.7-20.2s13-9.7 20.2-5.7l15.7 8.7 34.1-30.1c6.1-5.4 15.5-4.9 21 1.3 5.4 6.1 4.9 15.5-1.3 21l-42 37.1c-2.8 2.4-6.3 3.7-9.9 3.7z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">3472</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">2184</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Expert Employees</p>
               </div>
               <!--/column -->
               <div class="xl:w-3/12 lg:w-3/12 md:w-3/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
-                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#3f78e0] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
+                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 404.7" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/award-2.svg" class="svg-inject icon-svg icon-svg-lg !text-[#e31e24] !mb-3 !w-12 !h-12 m-[0_auto]"><path class="lineal-stroke" d="M90.8 404.7c-6.5 0-12.4-4-14.7-10.1L57.7 347 10 328.7c-8.1-3.1-12.2-12.2-9-20.4.8-2 2-3.9 3.5-5.5l93.6-93.6 97.3 97.3-93.6 93.6c-2.9 2.9-6.9 4.6-11 4.6zm-60.7-93.8l39.5 15.2c4.1 1.6 7.4 4.9 9 9l15.2 39.5 68.1-68.1-63.7-63.7-68.1 68.1zm288.7 93.8c-4.2 0-8.2-1.7-11.1-4.6l-20.8-20.8 16.8-16.8 12.1 12.1 15.2-39.5c1.6-4.1 4.9-7.4 9-9l39.4-15.2-76.4-76.5 16.8-16.8 85.2 85.2c6.1 6.1 6.1 16.1 0 22.3-1.6 1.6-3.4 2.8-5.5 3.6L351.9 347l-18.3 47.6c-1.9 5-6.2 8.7-11.4 9.8-1.1.2-2.2.3-3.4.3z"></path><path class="lineal-fill" d="M347.3 224.1c5.1-15.7 31-28.9 31-46.3s-25.9-30.6-31-46.3c-5.3-16.3 7.8-42.2-2.1-55.7s-38.6-9.2-52.4-19.2-18-38.6-34.4-43.9C242.7 7.6 222.2 28 204.8 28s-37.9-20.4-53.6-15.3c-16.3 5.3-20.8 34-34.4 43.9s-42.4 5.5-52.4 19.2 3.2 39.4-2.1 55.7c-5.1 15.7-31.1 28.8-31.1 46.3s25.9 30.6 31 46.3c5.3 16.3-7.8 42.1 2.1 55.7S103 289 116.7 299s18.1 38.6 34.4 43.9c15.7 5.1 36.2-15.3 53.6-15.3s37.9 20.4 53.6 15.3c16.3-5.3 20.8-34 34.4-43.9s42.4-5.5 52.4-19.2-3.1-39.3 2.2-55.7zm-142.5 48.7c-52.5 0-95-42.5-95-95s42.5-95 95-95 95 42.5 95 95-42.5 95-95 95z"></path><path class="lineal-stroke" d="M253 355.7c-10.1 0-19.6-4.6-28.8-9.1-7-3.4-14.3-7-19.4-7s-12.4 3.6-19.4 7c-9.2 4.5-18.7 9.1-28.8 9.1-3.1 0-6.2-.5-9.1-1.4-13.7-4.5-20.7-17.6-26.8-29.2-3.5-6.7-7.2-13.6-10.9-16.3s-11.6-4.2-19.2-5.5c-12.8-2.2-27.4-4.8-35.8-16.3s-6.3-26-4.5-38.8c1.1-7.6 2.2-15.6.7-20.2-1.4-4.2-6.7-9.8-11.9-15.1-9.2-9.5-19.7-20.2-19.7-34.9s10.5-25.4 19.7-34.9c5.2-5.3 10.6-10.8 12-15.1 1.5-4.7.4-12.6-.7-20.2C48.6 95 46.5 80.4 54.8 69s23-14.1 35.8-16.3c7.5-1.3 15.3-2.7 19.2-5.5s7.4-9.6 10.9-16.3c6.1-11.6 13.1-24.8 26.8-29.2 2.9-1 6-1.4 9.1-1.4 10.1 0 19.6 4.6 28.8 9.1 7 3.4 14.3 7 19.4 7s12.4-3.6 19.4-7C233.4 4.6 243 0 253 0c3.1 0 6.2.5 9.1 1.4 13.7 4.5 20.7 17.6 26.8 29.2 3.5 6.7 7.2 13.6 10.9 16.3s11.6 4.2 19.2 5.5c12.9 2.2 27.4 4.8 35.8 16.3s6.3 26 4.5 38.8c-1.1 7.6-2.2 15.6-.7 20.2 1.4 4.2 6.7 9.8 11.9 15.1 9.2 9.5 19.7 20.2 19.7 34.9s-10.5 25.4-19.7 34.9c-5.2 5.3-10.6 10.9-11.9 15.1-1.5 4.7-.4 12.6.7 20.2 1.8 12.9 3.9 27.4-4.5 38.8s-23 14.1-35.8 16.3c-7.5 1.3-15.3 2.7-19.2 5.5s-7.4 9.6-10.9 16.3c-6.1 11.6-13.1 24.8-26.8 29.2-2.9 1.2-6 1.7-9.1 1.7zm-48.2-39.9c10.6 0 20.4 4.8 29.8 9.4 6.8 3.3 13.8 6.7 18.4 6.7.6 0 1.2-.1 1.7-.2 4.5-1.5 9.1-10.1 13.1-17.8 4.8-9.1 9.8-18.5 18-24.5s18.9-7.9 29.1-9.7c8.4-1.5 18-3.1 20.7-6.9s1.3-13.2.1-21.6c-1.4-10.3-2.9-21 .3-30.8 3.1-9.5 10.4-17 17.5-24.3 6.1-6.2 13-13.3 13-18.3s-6.9-12.1-13-18.3c-7.1-7.3-14.4-14.8-17.5-24.3-3.2-9.9-1.7-20.5-.3-30.8 1.2-8.4 2.5-17.9-.1-21.6s-12.3-5.4-20.7-6.9c-10.2-1.8-20.8-3.6-29.1-9.7s-13.2-15.4-18-24.5c-4-7.6-8.6-16.3-13.1-17.8-.6-.2-1.2-.3-1.8-.2-4.6 0-11.6 3.4-18.4 6.7-9.5 4.6-19.3 9.4-29.8 9.4s-20.4-4.8-29.8-9.4c-6.8-3.3-13.8-6.7-18.4-6.7-.6 0-1.2.1-1.8.2-4.5 1.5-9.1 10.1-13.1 17.8-4.8 9.1-9.8 18.5-18 24.5s-18.9 7.9-29.1 9.7c-8.4 1.5-18 3.2-20.7 6.9s-1.3 13.2-.1 21.6c1.4 10.3 2.9 21-.3 30.8-3.1 9.5-10.4 17-17.5 24.3-6 6.2-12.9 13.3-12.9 18.3s6.9 12.1 13 18.3c7.1 7.3 14.4 14.8 17.5 24.3 3.2 9.9 1.7 20.5.3 30.8-1.2 8.4-2.5 17.9.1 21.6s12.3 5.4 20.7 6.9c10.2 1.8 20.8 3.6 29.1 9.7s13.2 15.4 18 24.5c4 7.6 8.6 16.3 13.1 17.7.6.2 1.2.3 1.8.2 4.6 0 11.6-3.4 18.4-6.7 9.5-4.6 19.3-9.3 29.8-9.3z"></path><path class="lineal-stroke" d="M204.8 284.7c-59 0-106.9-47.9-106.9-106.9 0-59 47.9-106.9 106.9-106.9 59 0 106.9 47.8 106.9 106.8v.1c-.1 59-47.9 106.9-106.9 106.9zm0-190c-45.9 0-83.2 37.2-83.2 83.1 0 45.9 37.2 83.2 83.1 83.2 45.9 0 83.2-37.2 83.2-83.1 0-25.8-12-50.1-32.4-65.9-14.4-11.2-32.3-17.3-50.7-17.3z"></path></svg>
                 <h3 class="counter xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !tracking-[normal] !leading-none !mb-2">4523</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Awards Won</p>
               </div>
@@ -1036,7 +1036,7 @@
       <div class="container pt-32 pb-[4.5rem] xl:pt-36 lg:pt-36 md:pt-36 xl:pb-24 lg:pb-24 md:pb-24">
         <div class="flex flex-wrap mx-[-15px] md:mx-[-20px] lg:mx-[-20px] xl:mx-[-35px] !mt-[-50px] items-center">
           <div class="md:w-8/12 lg:w-6/12 xl:w-5/12 lg:!ml-0 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"></div>
+            <div class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -2rem; left: -1.4rem;"></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem] w-full max-w-full !h-auto" src="../assets/img/photos/about4.jpg" alt="image"></figure>
           </div>
           <!--/column -->
@@ -1045,7 +1045,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-8">Convinced yet? Let's make something great together.</h2>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Address</h5>
@@ -1054,7 +1054,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">Phone</h5>
@@ -1063,7 +1063,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <div class="icon !text-[#3f78e0]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                <div class="icon !text-[#e31e24]  xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-6 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
               </div>
               <div>
                 <h5 class="!mb-1">E-mail</h5>
@@ -1099,7 +1099,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out   focus:bg-[#ffffff] focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="!text-[.85rem] btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="!text-[.85rem] btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1146,10 +1146,10 @@
           <div class="widget">
             <h4 class="widget-title !text-white !mb-3">Need Help?</h4>
             <ul class="pl-0 list-none text-inherit  !mb-0">
-  <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Support</a></li>
-  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Get Started</a></li>
-  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+  <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Support</a></li>
+  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Get Started</a></li>
+  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1159,11 +1159,11 @@
           <div class="widget">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-          <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Pricing</a></li>
-          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Features</a></li>
+          <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Pricing</a></li>
+          <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Features</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1173,7 +1173,7 @@
           <div class="widget">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class=" not-italic !leading-[inherit] !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1184,9 +1184,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/demo16.html b/public/html/demo16.html
index 68fa756..2a12d35 100644
--- a/public/html/demo16.html
+++ b/public/html/demo16.html
@@ -707,10 +707,10 @@
           <div class="card-body p-14">
             <div class="flex flex-wrap mx-[-15px] !mt-[-50px] items-center">
               <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!order-2 xl:!ml-[8.33333333%] lg:!order-2 lg:!ml-[8.33333333%] !mt-[50px]">
-                <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-3 !text-[#3f78e0]">Mobile Design</div>
+                <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-3 !text-[#e31e24]">Mobile Design</div>
                 <h3 class="h1 post-title !mb-3 !leading-[1.3]">Budget App</h3>
                 <p>Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus cursus.</p>
-                <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">See Project</a>
+                <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">See Project</a>
               </div>
               <!-- /column -->
               <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[50px]">
diff --git a/public/html/demo18.html b/public/html/demo18.html
index a397283..e9b443f 100644
--- a/public/html/demo18.html
+++ b/public/html/demo18.html
@@ -1184,7 +1184,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus:!border-[#9fbcf0] focus-visible:!border-[#9fbcf0]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="!text-[.85rem] btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] hover:!translate-none active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-gradient gradient-1">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="!text-[.85rem] btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] hover:!translate-none active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-gradient gradient-1">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
diff --git a/public/html/demo19.html b/public/html/demo19.html
index c49e577..ccfdab7 100644
--- a/public/html/demo19.html
+++ b/public/html/demo19.html
@@ -871,7 +871,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd7.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project.html'>Cras Fermentum Sem</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project.html'>Cras Fermentum Sem</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                   </div>
                   <!-- /.post-header -->
@@ -883,7 +883,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd8.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project2.html'>Mollis Ipsum Mattis</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project2.html'>Mollis Ipsum Mattis</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Magazine, Book</div>
                   </div>
                   <!-- /.post-header -->
@@ -895,7 +895,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd9.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project3.html'>Ipsum Ultricies Cursus</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project3.html'>Ipsum Ultricies Cursus</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                   </div>
                   <!-- /.post-header -->
@@ -907,7 +907,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd10.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project.html'>Inceptos Euismod Egestas</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project.html'>Inceptos Euismod Egestas</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary, Branding</div>
                   </div>
                   <!-- /.post-header -->
@@ -919,7 +919,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd11.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project2.html'>Ipsum Mollis Vulputate</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project2.html'>Ipsum Mollis Vulputate</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                   </div>
                   <!-- /.post-header -->
@@ -931,7 +931,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd12.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project3.html'>Porta Ornare Cras</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project3.html'>Porta Ornare Cras</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Branding</div>
                   </div>
                   <!-- /.post-header -->
diff --git a/public/html/demo2.html b/public/html/demo2.html
index 3caa071..e22b4f2 100644
--- a/public/html/demo2.html
+++ b/public/html/demo2.html
@@ -554,13 +554,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -579,7 +579,7 @@
       <div class="container pt-8 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem]">
         <div class="flex flex-wrap mx-[-15px] lg:mx-0 xl:mx-[-20px] !mb-7 md:!mb-10 lg:!mb-[6rem] xl:!mb-[6rem] items-center">
           <div class="md:w-8/12 md:!ml-[16.66666667%] lg:w-6/12 lg:!ml-[8.33333333%] xl:w-6/12 xl:!ml-[8.33333333%] w-full flex-[0_0_auto] !px-[15px] lg:px-0 xl:!px-[20px] max-w-full !relative lg:!order-2 xl:!order-2" data-cue="zoomIn">
-            <div class="shape bg-dot primary rellax !w-[7rem] !h-[9rem] absolute z-[1] opacity-50 !bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -1.7rem; left: -1.5rem;"></div>
+            <div class="shape bg-dot primary rellax !w-[7rem] !h-[9rem] absolute z-[1] opacity-50 !bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -1.7rem; left: -1.5rem;"></div>
             <div class="shape rounded !bg-[#edf2fc] rellax xl:block lg:block md:block absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -0.8rem; width: 85%; height: 90%;"></div>
             <figure class="rounded-[0.4rem] relative z-[2]"><img class="rounded-[0.4rem]" src="../assets/img/photos/about7.jpg" alt="image"></figure>
           </div>
@@ -588,7 +588,7 @@
             <h1 class="!text-[calc(1.385rem_+_1.62vw)]  !font-normal !tracking-[normal] font-DMSerif !leading-[1.1] xl:!text-[2.6rem] !mb-5">We bring solutions to make life easier for our customers.</h1>
             <p class="lead text-[1.25rem] leading-normal !mb-7 md:!px-10 lg:!px-0">We have considered our solutions to support every stage of your growth.</p>
             <div class="flex justify-center lg:!justify-start xl:!justify-start" data-cues="slideInDown" data-group="page-title-buttons" data-delay="900">
-              <span><a href="#" class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mr-2">Explore Now</a></span>
+              <span><a href="#" class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mr-2">Explore Now</a></span>
               <span><a href="#" class="btn btn-lg btn-outline-primary !rounded-[50rem]">Free Trial</a></span>
             </div>
           </div>
@@ -635,28 +635,28 @@
         <!-- /.row -->
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] md:mx-[-20px] !mt-[-40px] !text-center !mb-[4.5rem] xl:!mb-[7rem] lg:!mb-[7rem] md:!mb-[7rem]">
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
-            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
             <h4>24/7 Support</h4>
             <p class="!mb-3">Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla.</p>
             <a href="#" class="more hover">Learn More</a>
           </div>
           <!--/column -->
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
-            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-shield-exclamation before:content-['\ecb3']"></i> </div>
+            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-shield-exclamation before:content-['\ecb3']"></i> </div>
             <h4>Secure Payments</h4>
             <p class="!mb-3">Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla.</p>
             <a href="#" class="more hover">Learn More</a>
           </div>
           <!--/column -->
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
-            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-laptop-cloud before:content-['\ebb2']"></i> </div>
+            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-laptop-cloud before:content-['\ebb2']"></i> </div>
             <h4>Daily Updates</h4>
             <p class="!mb-3">Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla.</p>
             <a href="#" class="more hover">Learn More</a>
           </div>
           <!--/column -->
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !mt-[40px] max-w-full">
-            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-chart-line before:content-['\e9d3']"></i> </div>
+            <div class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-5 !w-[3rem] !h-[3rem] xl:!text-[1.3rem] !text-[calc(1.255rem_+_0.06vw)] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-chart-line before:content-['\e9d3']"></i> </div>
             <h4>Market Research</h4>
             <p class="!mb-3">Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla.</p>
             <a href="#" class="more hover">Learn More</a>
@@ -666,7 +666,7 @@
         <!--/.row -->
         <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center !mb-[4.5rem] md:!mb-[7rem] lg:!mb-[9rem] xl:!mb-[9rem]">
           <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]">
-            <div class="shape bg-line red !rounded-[50%] rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50 bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2.2rem; left: -2.4rem;"></div>
+            <div class="shape bg-line red !rounded-[50%] rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50 bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: -2.2rem; left: -2.4rem;"></div>
 
             <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem]" src="../assets/img/photos/about9.jpg" alt="image"></figure>
@@ -677,7 +677,7 @@
             <p class="lead text-[1.05rem] !leading-[1.6] !mb-6">So here are three working steps why our valued customers choose us.</p>
             <div class="flex flex-row !mb-6">
               <div>
-                <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
+                <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">1</span></span>
               </div>
               <div>
                 <h4 class="!mb-1">Collect Ideas</h4>
@@ -686,7 +686,7 @@
             </div>
             <div class="flex flex-row !mb-6">
               <div>
-                <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
+                <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">2</span></span>
               </div>
               <div>
                 <h4 class="!mb-1">Data Analysis</h4>
@@ -695,7 +695,7 @@
             </div>
             <div class="flex flex-row">
               <div>
-                <span class="icon btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
+                <span class="icon btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mr-5 w-[2.2rem] h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"><span class="number text-[0.9rem] table-cell text-center align-middle font-bold mx-auto my-0">3</span></span>
               </div>
               <div>
                 <h4 class="!mb-1">Finalize Product</h4>
@@ -759,7 +759,7 @@
       <div class="container">
         <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center !mb-[4.5rem] md:!mb-[7rem] lg:!mb-[9rem] xl:!mb-[9rem]">
           <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative !mt-[80px]">
-            <a href="../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#3f78e0] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#3f78e0] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
+            <a href="../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e31e24] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e31e24] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
             <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
             <figure class="!rounded-[.4rem] relative z-[2]"><img class="!rounded-[.4rem]" src="../assets/img/photos/about12.jpg" alt="image"></figure>
           </div>
@@ -771,15 +771,15 @@
             <div class="flex flex-wrap mx-[-15px] !mt-[-15px] xl:mx-[-20px]">
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
                 </ul>
               </div>
               <!--/column -->
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !mt-[15px] xl:!px-[20px] !px-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
               </div>
               <!--/column -->
@@ -794,7 +794,7 @@
             <h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">MEET THE TEAM</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] !font-normal font-DMSerif xl:!text-[1.8rem] !leading-[1.2] !mb-[1.25rem]">Save your time and money by choosing our professional team.</h3>
             <p>Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros tempus porttitor.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
           </div>
           <!--/column -->
           <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
@@ -939,11 +939,11 @@
           <div class="widget">
             <h4 class="widget-title !mb-3">Learn More</h4>
             <ul class="pl-0 list-none !mb-0">
-              <li><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -961,7 +961,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset]   focus-visible:!border-[rgba(63,120,224,0.5)]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -985,9 +985,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/demo20.html b/public/html/demo20.html
index 6d5222a..a0191a5 100644
--- a/public/html/demo20.html
+++ b/public/html/demo20.html
@@ -778,7 +778,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd7.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project.html'>Cras Fermentum Sem</a></h2>
+                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project.html'>Cras Fermentum Sem</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                 </div>
                 <!-- /.post-header -->
@@ -790,7 +790,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd8.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project2.html'>Mollis Ipsum Mattis</a></h2>
+                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project2.html'>Mollis Ipsum Mattis</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Magazine, Book</div>
                 </div>
                 <!-- /.post-header -->
@@ -802,7 +802,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd9.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project3.html'>Ipsum Ultricies Cursus</a></h2>
+                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project3.html'>Ipsum Ultricies Cursus</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                 </div>
                 <!-- /.post-header -->
@@ -814,7 +814,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd10.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project.html'>Inceptos Euismod Egestas</a></h2>
+                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project.html'>Inceptos Euismod Egestas</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary, Branding</div>
                 </div>
                 <!-- /.post-header -->
@@ -826,7 +826,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd11.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project2.html'>Ipsum Mollis Vulputate</a></h2>
+                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project2.html'>Ipsum Mollis Vulputate</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                 </div>
                 <!-- /.post-header -->
@@ -838,7 +838,7 @@
               <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd12.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
               <div class="project-details flex justify-center flex-col">
                 <div class="post-header">
-                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project3.html'>Porta Ornare Cras</a></h2>
+                  <h2 class="post-title h3 !text-[1.1rem] !leading-[1.4]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project3.html'>Porta Ornare Cras</a></h2>
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Branding</div>
                 </div>
                 <!-- /.post-header -->
diff --git a/public/html/demo22.html b/public/html/demo22.html
index f3e0f6a..79834fd 100644
--- a/public/html/demo22.html
+++ b/public/html/demo22.html
@@ -708,19 +708,19 @@
               <h3 class="xl:!text-[1.9rem] !text-[calc(1.315rem_+_0.78vw)] !leading-[1.25] !mb-6">Find out everything about creating a business model.</h3>
               <div class="flex flex-wrap mx-[-15px] !mt-[-20px]">
                 <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                  <h4><span class="!text-[#3f78e0] ">1.</span> Creative Ideas</h4>
+                  <h4><span class="!text-[#e31e24] ">1.</span> Creative Ideas</h4>
                   <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
                 </div>
                 <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                  <h4><span class="!text-[#3f78e0] ">2.</span> Magic Touch</h4>
+                  <h4><span class="!text-[#e31e24] ">2.</span> Magic Touch</h4>
                   <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
                 </div>
                 <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                  <h4><span class="!text-[#3f78e0] ">3.</span> Data Analysis</h4>
+                  <h4><span class="!text-[#e31e24] ">3.</span> Data Analysis</h4>
                   <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
                 </div>
                 <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[20px]">
-                  <h4><span class="!text-[#3f78e0] ">4.</span> Finalize Product</h4>
+                  <h4><span class="!text-[#e31e24] ">4.</span> Finalize Product</h4>
                   <p class="!mb-0">Nulla vitae elit libero a augue donec id elit non mi porta.</p>
                 </div>
                 <!--/column -->
@@ -852,7 +852,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd7.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd7-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project.html'>Cras Fermentum Sem</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project.html'>Cras Fermentum Sem</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary</div>
                   </div>
                   <!-- /.post-header -->
@@ -864,7 +864,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd8.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd8-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project2.html'>Mollis Ipsum Mattis</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project2.html'>Mollis Ipsum Mattis</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Magazine, Book</div>
                   </div>
                   <!-- /.post-header -->
@@ -876,7 +876,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd9.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd9-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project3.html'>Ipsum Ultricies Cursus</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project3.html'>Ipsum Ultricies Cursus</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                   </div>
                   <!-- /.post-header -->
@@ -888,7 +888,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd10.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd10-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project.html'>Inceptos Euismod Egestas</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project.html'>Inceptos Euismod Egestas</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Stationary, Branding</div>
                   </div>
                   <!-- /.post-header -->
@@ -900,7 +900,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd11.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd11-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project2.html'>Ipsum Mollis Vulputate</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project2.html'>Ipsum Mollis Vulputate</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Packaging</div>
                   </div>
                   <!-- /.post-header -->
@@ -912,7 +912,7 @@
                 <figure class="!rounded-[.4rem] !mb-6"><img class="!rounded-[.4rem]" src="../assets/img/photos/pd12.jpg" alt="image"><a class="item-link absolute w-[2.2rem] h-[2.2rem] !leading-[2.2rem] z-[1] transition-all duration-[0.3s] ease-in-out opacity-0 !text-[#343f52] shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.02)] text-[1rem] flex items-center justify-center rounded-[100%] right-0 bottom-4 bg-[rgba(255,255,255,.7)] hover:bg-[rgba(255,255,255,.9)] hover:!text-[#343f52] group-hover:opacity-100 group-hover:right-[1rem]" href="../assets/img/photos/pd12-full.jpg" data-glightbox data-gallery="projects-group"><i class="uil uil-focus-add before:content-['\eb22']"></i></a></figure>
                 <div class="project-details flex justify-center flex-col">
                   <div class="post-header">
-                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='single-project3.html'>Porta Ornare Cras</a></h2>
+                    <h2 class="post-title h3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='single-project3.html'>Porta Ornare Cras</a></h2>
                     <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !mb-[0.4rem] !text-[#9499a3]">Branding</div>
                   </div>
                   <!-- /.post-header -->
diff --git a/public/html/demo3.html b/public/html/demo3.html
index b89d9ed..a3c5e3a 100644
--- a/public/html/demo3.html
+++ b/public/html/demo3.html
@@ -1420,7 +1420,7 @@
           <div
             class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !mt-[80px] xl:!px-[7.5px] lg:!px-[7.5px] !px-[15px] max-w-full !relative">
             <div
-              class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]"
+              class="shape bg-dot primary rellax !w-[7rem] !h-[12.5rem] absolute z-[1] opacity-50 bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]"
               data-rellax-speed="1" style="top: -2rem; left: -1.9rem;"></div>
             <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]"
               data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
diff --git a/public/html/demo31.html b/public/html/demo31.html
index 3cb4733..70a8f51 100644
--- a/public/html/demo31.html
+++ b/public/html/demo31.html
@@ -18,7 +18,7 @@
   <link rel="preload" href="../assets/css/fonts/space.css" as="style" onload="this.rel='stylesheet'">
   <style>
     .solid.text-primary .fill-primary, .solid.text-primary .fill-secondary {
-    fill: #3f78e0 !important;
+    fill: #e31e24 !important;
 }
   </style>
 </head>
@@ -559,13 +559,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[0.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[0.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -584,10 +584,10 @@
       <div class="container pt-12 xl:pt-16 lg:pt-16 md:pt-16 pb-36 xl:pb-28 lg:pb-28 md:pb-28 !text-center">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto" data-cues="slideInDown" data-group="page-title" data-delay="500">
-            <h1 class="xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] font-bold !leading-[1.15] !tracking-[-0.03em]  !mb-4 md:!px-8 lg:!px-0">We bring rapid solutions for your <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>business</em></span></h1>
+            <h1 class="xl:!text-[3.2rem] !text-[calc(1.445rem_+_2.34vw)] font-bold !leading-[1.15] !tracking-[-0.03em]  !mb-4 md:!px-8 lg:!px-0">We bring rapid solutions for your <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>business</em></span></h1>
             <p class="lead !text-[1.2rem] !leading-[1.5] !mb-7">We are creative company that values quality and focuses on establishing long-term relationships with customers.</p>
             <div>
-              <a class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded !mb-10 xxl:!mb-5">See Projects</a>
+              <a class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mb-10 xxl:!mb-5">See Projects</a>
             </div>
           </div>
           <!-- /column -->
@@ -637,7 +637,7 @@
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="md:w-10/12 lg:w-9/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14">
             <h2 class="!text-[0.8rem] !tracking-[0.02rem] !leading-[1.35] uppercase !text-[#aab0bc] !mb-3">Our Services</h2>
-            <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] xxl:!px-10">The service we offer is <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>designed</em></span> to meet your business needs.</h3>
+            <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] xxl:!px-10">The service we offer is <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>designed</em></span> to meet your business needs.</h3>
           </div>
           <!-- /column -->
         </div>
@@ -648,15 +648,15 @@
           </div>
           <!-- /column -->
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto !mt-[50px]">
-            <div class="svg-bg !bg-[#e0e9fa] rounded !mb-5"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/like.svg" class="svg-inject icon-svg solid text-[#3f78e0] text-primary"><g data-name="Layer 2"><path class="fill-primary" d="M226.67 21.33a8 8 0 018 8v144a8 8 0 01-8 8H107.31a21.3 21.3 0 00-15.09 6.25L64 215.81v-13.14a21.34 21.34 0 00-21.33-21.33H29.33a8 8 0 01-8-8v-144a8 8 0 018-8h197.34zm0-21.33H29.33A29.35 29.35 0 000 29.33v144a29.36 29.36 0 0029.33 29.33h13.33V248a8 8 0 004.94 7.39 7.82 7.82 0 003.07.61 8.09 8.09 0 005.67-2.34l51-51h119.35A29.36 29.36 0 00256 173.34v-144A29.39 29.39 0 00226.67 0z"></path><path class="fill-secondary" d="M96 146.67a10.67 10.67 0 01-10.67 10.67H74.66A10.68 10.68 0 0164 146.67v-64A10.67 10.67 0 0174.66 72h10.67A10.67 10.67 0 0196 82.67zm89.92-10.88C184 148.06 172.8 157.34 160 157.34h-8.11c-21.33 0-36.16-4-45.44-7.79a25.36 25.36 0 00.21-2.88v-64A21.24 21.24 0 00104 72.32c5.65-4.48 12.69-11.73 12.69-19.84 0-6.61 0-20.27 12.8-20.27 8.53 0 17.81 7.89 17.81 25.17A48.86 48.86 0 01145 72h21.23A25.76 25.76 0 01192 97.71c0 .32-1.28 27.09-6.51 38z"></path></g></svg> </div>
+            <div class="svg-bg !bg-[#e0e9fa] rounded !mb-5"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 256.02 256" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/solid/like.svg" class="svg-inject icon-svg solid text-[#e31e24] text-primary"><g data-name="Layer 2"><path class="fill-primary" d="M226.67 21.33a8 8 0 018 8v144a8 8 0 01-8 8H107.31a21.3 21.3 0 00-15.09 6.25L64 215.81v-13.14a21.34 21.34 0 00-21.33-21.33H29.33a8 8 0 01-8-8v-144a8 8 0 018-8h197.34zm0-21.33H29.33A29.35 29.35 0 000 29.33v144a29.36 29.36 0 0029.33 29.33h13.33V248a8 8 0 004.94 7.39 7.82 7.82 0 003.07.61 8.09 8.09 0 005.67-2.34l51-51h119.35A29.36 29.36 0 00256 173.34v-144A29.39 29.39 0 00226.67 0z"></path><path class="fill-secondary" d="M96 146.67a10.67 10.67 0 01-10.67 10.67H74.66A10.68 10.68 0 0164 146.67v-64A10.67 10.67 0 0174.66 72h10.67A10.67 10.67 0 0196 82.67zm89.92-10.88C184 148.06 172.8 157.34 160 157.34h-8.11c-21.33 0-36.16-4-45.44-7.79a25.36 25.36 0 00.21-2.88v-64A21.24 21.24 0 00104 72.32c5.65-4.48 12.69-11.73 12.69-19.84 0-6.61 0-20.27 12.8-20.27 8.53 0 17.81 7.89 17.81 25.17A48.86 48.86 0 01145 72h21.23A25.76 25.76 0 01192 97.71c0 .32-1.28 27.09-6.51 38z"></path></g></svg> </div>
             <h3 class="h1 !leading-[1.3] post-title !tracking-[-0.03em] !mb-3">Social Media Marketing</h3>
             <p>Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus.</p>
             <ul class="pl-0 list-none bullet-bg bullet-soft-primary">
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Fusce dapibus, tellus ac cursus commodo.</li>
             </ul>
-            <a href="#" class="more hover !text-[#3f78e0]   hover:!text-[#3f78e0]">Learn More</a>
+            <a href="#" class="more hover !text-[#e31e24]   hover:!text-[#e31e24]">Learn More</a>
           </div>
           <!-- /column -->
         </div>
@@ -710,7 +710,7 @@
             <div class="flex flex-wrap mx-[-15px] !text-center">
               <div class="lg:w-9/12 xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
                 <h2 class="!text-[0.8rem] !tracking-[0.02rem] !leading-[1.35] uppercase !text-[#aab0bc] !mb-3">Happy Customers</h2>
-                <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] !mb-10 xxl:!px-10">Don't take our word for it. See what our <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>customers</em></span> are saying about us.</h3>
+                <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] !mb-10 xxl:!px-10">Don't take our word for it. See what our <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>customers</em></span> are saying about us.</h3>
               </div>
               <!-- /column -->
             </div>
@@ -780,7 +780,7 @@
         <div class="flex flex-wrap mx-[-15px] !text-center">
           <div class="xl:w-10/12 lg:w-10/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !mb-14">
             <h2 class="!text-[0.8rem] !tracking-[0.02rem] !leading-[1.35] uppercase !text-[#aab0bc] !mb-3">Latest Projects</h2>
-            <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] !mb-[10]">Check out some of our <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>awesome</em></span> projects with creative ideas and great design.</h3>
+            <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] !mb-[10]">Check out some of our <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>awesome</em></span> projects with creative ideas and great design.</h3>
           </div>
           <!-- /column -->
         </div>
@@ -834,7 +834,7 @@
               <span>Branding</span>, <span>Web Design</span>
             </div>
             <p class="!mb-6">Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus. Donec sed odio dui. Vivamus sagittis lacus vel.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See Project</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See Project</a>
           </div>
           <!-- /column -->
         </div>
@@ -886,7 +886,7 @@
         <div class="flex flex-wrap mx-[-15px] !text-center !mb-7">
           <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <h2 class="!text-[0.8rem] !tracking-[0.02rem] !leading-[1.35] uppercase !text-[#aab0bc] !mb-3">Join Our Community</h2>
-            <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] !mb-[10]">We are <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#3f78e0] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#3f78e0] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>trusted</em></span> by over 50000+ clients. Join them now and grow your business.</h3>
+            <h3 class=" !text-[calc(1.345rem_+_1.14vw)] font-semibold !leading-[1.2] xl:!text-[2.2rem] !tracking-[-0.03em] !mb-[10]">We are <span class="!relative z-[1] style-1 primary before:content-[''] before:z-[-1] before:absolute before:opacity-100 before:block before:-translate-x-2/4 before:-translate-y-2/4 before:-rotate-1 before:w-[111%] before:h-[110%] before:rounded-[80%] before:border-t-0 before:border-[3px] before:border-solid before:border-[#e31e24] before:left-2/4 before:!top-[52%] after:content-[''] after:z-[-1] after:absolute after:opacity-100 after:block after:[background-size:100%_100%] after:bg-no-repeat after:bg-bottom after:bottom-[-0.1em] after:-translate-x-2/4 after:-translate-y-2/4 after:-rotate-2 after:w-[107%] after:h-[111%] after:rounded-[80%] after:border-l-0 after:border-b-0 after:border-[3px] after:border-solid after:border-[#e31e24] after:left-2/4 after:top-[52%] max-xl:before:!hidden max-xl:after:!hidden max-lg:before:!hidden max-lg:after:!hidden max-md:before:!hidden max-md:after:!hidden max-sm:before:!hidden max-sm:after:!hidden"><em>trusted</em></span> by over 50000+ clients. Join them now and grow your business.</h3>
           </div>
           <!-- /column -->
         </div>
@@ -895,17 +895,17 @@
           <div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.25rem]  !text-[#3f78e0]">1000+</h3>
+                <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.25rem]  !text-[#e31e24]">1000+</h3>
                 <p class="!mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.25rem]  !text-[#3f78e0]">50K+</h3>
+                <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.25rem]  !text-[#e31e24]">50K+</h3>
                 <p class="!mb-0">Happy Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.25rem]  !text-[#3f78e0]">4x</h3>
+                <h3 class="counter counter-lg !text-[calc(1.35rem_+_1.2vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.25rem]  !text-[#e31e24]">4x</h3>
                 <p class="!mb-0">Revenue Growth</p>
               </div>
               <!--/column -->
@@ -967,11 +967,11 @@
           <div class="widget">
             <h4 class="widget-title !mb-3 !text-[0.95rem] !leading-[1.45]">Learn More</h4>
             <ul class="pl-0 list-none !mb-0">
-              <li><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -989,7 +989,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required form-control  relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out   focus:bg-[#ffffff] focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus:!border-[#9fbcf0] focus-visible:!border-[#9fbcf0]   placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="!text-[.85rem] btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="!text-[.85rem] btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1013,9 +1013,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/demo32.html b/public/html/demo32.html
index 2d62cf1..9836b68 100644
--- a/public/html/demo32.html
+++ b/public/html/demo32.html
@@ -261,54 +261,54 @@
                 <li class="nav-item dropdown">
                   <a class="nav-link dropdown-toggle  font-bold !tracking-[-0.01rem]" href="#" data-bs-toggle="dropdown">Pages</a>
                   <ul class="dropdown-menu">
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Services</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='services.html'>Services I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='services2.html'>Services II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='services.html'>Services I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='services2.html'>Services II</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">About</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='about.html'>About I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='about2.html'>About II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='about.html'>About I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='about2.html'>About II</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Shop</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop.html'>Shop I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop2.html'>Shop II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop-product.html'>Product Page</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop-cart.html'>Shopping Cart</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='shop-checkout.html'>Checkout</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop.html'>Shop I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop2.html'>Shop II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-product.html'>Product Page</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-cart.html'>Shopping Cart</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='shop-checkout.html'>Checkout</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Contact</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='contact.html'>Contact I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='contact2.html'>Contact II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='contact3.html'>Contact III</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact.html'>Contact I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact2.html'>Contact II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='contact3.html'>Contact III</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Career</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='career.html'>Job Listing I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='career2.html'>Job Listing II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='career-job.html'>Job Description</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career.html'>Job Listing I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career2.html'>Job Listing II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='career-job.html'>Job Description</a></li>
                       </ul>
                     </li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Utility</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='404.html'>404 Not Found</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='page-loader.html'>Page Loader</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signin.html'>Sign In I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signin2.html'>Sign In II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signup.html'>Sign Up I</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='signup2.html'>Sign Up II</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='terms.html'>Terms</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='404.html'>404 Not Found</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='page-loader.html'>Page Loader</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signin.html'>Sign In I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signin2.html'>Sign In II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signup.html'>Sign Up I</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='signup2.html'>Sign Up II</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='terms.html'>Terms</a></li>
                       </ul>
                     </li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='pricing.html'>Pricing</a></li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='onepage.html'>One Page</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='pricing.html'>Pricing</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='onepage.html'>One Page</a></li>
                   </ul>
                 </li>
                 <li class="nav-item dropdown">
@@ -316,22 +316,22 @@
                   <div class="dropdown-menu dropdown-lg">
                     <div class="dropdown-lg-content">
                       <div>
-                        <h6 class="dropdown-header !text-[#3f78e0]">Project Pages</h6>
+                        <h6 class="dropdown-header !text-[#e31e24]">Project Pages</h6>
                         <ul class="pl-0 list-none">
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects.html'>Projects I</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects2.html'>Projects II</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects3.html'>Projects III</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='projects4.html'>Projects IV</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects.html'>Projects I</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects2.html'>Projects II</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects3.html'>Projects III</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='projects4.html'>Projects IV</a></li>
                         </ul>
                       </div>
                       <!-- /.column -->
                       <div>
-                        <h6 class="dropdown-header !text-[#3f78e0]">Single Projects</h6>
+                        <h6 class="dropdown-header !text-[#e31e24]">Single Projects</h6>
                         <ul class="pl-0 list-none">
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project.html'>Single Project I</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project2.html'>Single Project II</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project3.html'>Single Project III</a></li>
-                          <li><a class='dropdown-item hover:!text-[#3f78e0]' href='single-project4.html'>Single Project IV</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project.html'>Single Project I</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project2.html'>Single Project II</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project3.html'>Single Project III</a></li>
+                          <li><a class='dropdown-item hover:!text-[#e31e24]' href='single-project4.html'>Single Project IV</a></li>
                         </ul>
                       </div>
                       <!-- /.column -->
@@ -342,14 +342,14 @@
                 <li class="nav-item dropdown">
                   <a class="nav-link dropdown-toggle  font-bold !tracking-[-0.01rem]" href="#" data-bs-toggle="dropdown">Blog</a>
                   <ul class="dropdown-menu">
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog.html'>Blog without Sidebar</a></li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog2.html'>Blog with Sidebar</a></li>
-                    <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog3.html'>Blog with Left Sidebar</a></li>
-                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#3f78e0] dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog.html'>Blog without Sidebar</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog2.html'>Blog with Sidebar</a></li>
+                    <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog3.html'>Blog with Left Sidebar</a></li>
+                    <li class="dropdown dropdown-submenu dropend"><a class="dropdown-item hover:!text-[#e31e24] dropdown-toggle" href="#" data-bs-toggle="dropdown">Blog Posts</a>
                       <ul class="dropdown-menu">
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog-post.html'>Post without Sidebar</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog-post2.html'>Post with Sidebar</a></li>
-                        <li class="nav-item"><a class='dropdown-item hover:!text-[#3f78e0]' href='blog-post3.html'>Post with Left Sidebar</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post.html'>Post without Sidebar</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post2.html'>Post with Sidebar</a></li>
+                        <li class="nav-item"><a class='dropdown-item hover:!text-[#e31e24]' href='blog-post3.html'>Post with Left Sidebar</a></li>
                       </ul>
                     </li>
                   </ul>
@@ -457,56 +457,56 @@
                     <li class="mega-menu-content">
                       <div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
                         <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] max-w-full">
-                          <h6 class="dropdown-header !text-[#3f78e0]">Usage</h6>
+                          <h6 class="dropdown-header !text-[#e31e24]">Usage</h6>
                           <ul class="pl-0 list-none  xl:columns-2 lg:columns-2  xl:pb-1 lg:pb-1">
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/index.html'>Get Started</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/forms.html'>Forms</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/faq.html'>FAQ</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/changelog.html'>Changelog</a></li>
-      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/credits.html'>Credits</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/index.html'>Get Started</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/forms.html'>Forms</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/faq.html'>FAQ</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/changelog.html'>Changelog</a></li>
+      <li class="xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/credits.html'>Credits</a></li>
                           </ul>
-                          <h6 class="dropdown-header !text-[#3f78e0] xl:!mt-6 lg:!mt-6">Styleguide</h6>
+                          <h6 class="dropdown-header !text-[#e31e24] xl:!mt-6 lg:!mt-6">Styleguide</h6>
                           <ul class="pl-0 list-none  xl:columns-2 lg:columns-2 ">
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/colors.html'>Colors</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/fonts.html'>Fonts</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
-    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/styleguide/misc.html'>Misc</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/colors.html'>Colors</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/fonts.html'>Fonts</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/icons-svg.html'>SVG Icons</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/icons-font.html'>Font Icons</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/illustrations.html'>Illustrations</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/backgrounds.html'>Backgrounds</a></li>
+    <li class=" xl:inline-block xl:w-full lg:inline-block lg:w-full"><a class='dropdown-item hover:!text-[#e31e24]' href='docs/styleguide/misc.html'>Misc</a></li>
                           </ul>
                         </div>
                         <!--/column -->
                         <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid">
-                          <h6 class="dropdown-header !text-[#3f78e0]">Elements</h6>
+                          <h6 class="dropdown-header !text-[#e31e24]">Elements</h6>
                           <ul class="pl-0 list-none  xl:columns-3 lg:columns-3 ">
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/accordion.html'>Accordion</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/alerts.html'>Alerts</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/animations.html'>Animations</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/avatars.html'>Avatars</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/background.html'>Background</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/badges.html'>Badges</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/buttons.html'>Buttons</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/card.html'>Card</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/carousel.html'>Carousel</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/dividers.html'>Dividers</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/form-elements.html'>Form Elements</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/image-hover.html'>Image Hover</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/image-mask.html'>Image Mask</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/lightbox.html'>Lightbox</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/player.html'>Media Player</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/modal.html'>Modal</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/pagination.html'>Pagination</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/progressbar.html'>Progressbar</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/shadows.html'>Shadows</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/shapes.html'>Shapes</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tables.html'>Tables</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tabs.html'>Tabs</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/text-animations.html'>Text Animations</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tiles.html'>Tiles</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
-                            <li><a class='dropdown-item hover:!text-[#3f78e0]' href='docs/elements/typography.html'>Typography</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/accordion.html'>Accordion</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/alerts.html'>Alerts</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/animations.html'>Animations</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/avatars.html'>Avatars</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/background.html'>Background</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/badges.html'>Badges</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/buttons.html'>Buttons</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/card.html'>Card</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/carousel.html'>Carousel</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/dividers.html'>Dividers</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/form-elements.html'>Form Elements</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/image-hover.html'>Image Hover</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/image-mask.html'>Image Mask</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/lightbox.html'>Lightbox</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/player.html'>Media Player</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/modal.html'>Modal</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/pagination.html'>Pagination</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/progressbar.html'>Progressbar</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/shadows.html'>Shadows</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/shapes.html'>Shapes</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tables.html'>Tables</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tabs.html'>Tabs</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/text-animations.html'>Text Animations</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/text-highlight.html'>Text Highlight</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tiles.html'>Tiles</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/tooltips-popovers.html'>Tooltips & Popovers</a></li>
+                            <li><a class='dropdown-item hover:!text-[#e31e24]' href='docs/elements/typography.html'>Typography</a></li>
                           </ul>
                         </div>
                         <!--/column -->
@@ -567,16 +567,16 @@
           <div class="widget !mb-8">
             <h4 class="widget-title !text-white !mb-[0.75rem] !text-[.95rem] !leading-[1.45]">Contact Info</h4>
             <address class=" not-italic !leading-[inherit] !mb-[1rem]"> Moonshine St. 14/05 <br> Light City, London </address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
           <div class="widget !mb-8">
             <h4 class="widget-title !text-white !mb-[0.75rem] !text-[.95rem] !leading-[1.45]">Learn More</h4>
             <ul class="list-unstyled !pl-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Contact Us</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Contact Us</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -613,7 +613,7 @@
         <div class="flex flex-wrap mx-[-15px]">
           <div class="lg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto" data-cues="zoomIn" data-group="page-title" data-interval="-200" data-delay="500">
             <h2 class="h6 uppercase !text-[0.85rem] !tracking-[0.05rem] !leading-[1.55] !text-white !mb-5">Hello! We are Trunçgil</h2>
-            <h1 class="xl:!text-[3.4rem] !text-[calc(1.465rem_+_2.58vw)] !leading-[1.05] font-semibold !mb-8 !text-white">We have considered our solutions to <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"><em>assist</em></span> every stage of your growth.</h1>
+            <h1 class="xl:!text-[3.4rem] !text-[calc(1.465rem_+_2.58vw)] !leading-[1.05] font-semibold !mb-8 !text-white">We have considered our solutions to <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"><em>assist</em></span> every stage of your growth.</h1>
             <div class="flex justify-center !mb-4" data-cues="zoomIn" data-group="page-title-buttons" data-delay="900">
               <span><a href="#" class="btn btn-lg btn-white">Explore Now</a></span>
             </div>
@@ -651,7 +651,7 @@
           </div>
           <!--/column -->
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[80px]">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Who Are We?</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Who Are We?</h2>
             <h3 class="xl:!text-[2rem] !leading-[1.2] !text-[calc(1.325rem_+_0.9vw)] font-semibold !mb-5">Company that believes in the power of creative strategy.</h3>
             <p class="!mb-6">Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aenean lacinia bibendum nulla sed.</p>
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-30px]">
@@ -710,7 +710,7 @@
           <!--/column -->
         </div>
         <!--/.row -->
-        <div class="text-center"><a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]">More Details</a></div>
+        <div class="text-center"><a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]">More Details</a></div>
       </div>
       <!-- /.container -->
     </section>
@@ -836,13 +836,13 @@
           </div>
           <!--/column -->
           <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[20px] lg:!px-[20px] md:!px-[20px] !px-[15px] max-w-full !mt-[50px]">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35] !tracking-[0.02rem]">What Makes Us Different?</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">What Makes Us Different?</h2>
             <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-semibold xl:!text-[2rem] !leading-[1.2] !mb-5">We make spending stress free so you have the perfect control.</h3>
             <p class="!mb-6">Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus. Integer posuere erat a ante venenatis.</p>
             <ul class="pl-0 list-none bullet-bg bullet-soft-primary">
-              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+              <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+              <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
             </ul>
           </div>
           <!--/column -->
@@ -856,7 +856,7 @@
       <div class="container py-[5rem] xl:!py-[7rem] lg:!py-[7rem] md:!py-[7rem]">
         <div class="flex flex-wrap mx-[-15px] !text-center">          
           <div class="llg:w-10/12 xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Case Studies</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Case Studies</h2>
             <h3 class="xl:!text-[2rem] !leading-[1.2] !text-[calc(1.325rem_+_0.9vw)] font-semibold !mb-10">Check out some of our awesome projects with creative ideas and great design.</h3>
           </div>
           <!-- /column -->
@@ -873,7 +873,7 @@
                 </figure>
                 <div class="card-body flex-[1_1_auto] !p-[1.75rem_1.75rem_1rem_1.75rem] max-md:!p-[40px_40px_20px]">
                   <div class="post-header">
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ligula tristique quis risus</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="!relative">
@@ -885,7 +885,7 @@
                <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] max-md:!p-[0.9rem_2rem]">
                   <ul class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                     <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>14 Apr 2022</span></li>
-                    <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-file-alt !text-[.75rem] pr-[0.2rem] align-[-.05rem] before:content-['\eaec']"></i>Coding</a></li>
+                    <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-file-alt !text-[.75rem] pr-[0.2rem] align-[-.05rem] before:content-['\eaec']"></i>Coding</a></li>
                   </ul>
                   <!-- /.post-meta -->
                 </div>
@@ -906,7 +906,7 @@
                 </figure>
                 <div class="card-body flex-[1_1_auto] !p-[1.75rem_1.75rem_1rem_1.75rem] max-md:!p-[40px_40px_20px]">
                   <div class="post-header">
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Nullam id dolor elit id nibh</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="!relative">
@@ -918,7 +918,7 @@
                <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] max-md:!p-[0.9rem_2rem]">
                   <ul class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                     <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>29 Mar 2022</span></li>
-                    <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-file-alt !text-[.75rem] pr-[0.2rem] align-[-.05rem] before:content-['\eaec']"></i>Office</a></li>
+                    <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-file-alt !text-[.75rem] pr-[0.2rem] align-[-.05rem] before:content-['\eaec']"></i>Office</a></li>
                   </ul>
                   <!-- /.post-meta -->
                 </div>
@@ -939,7 +939,7 @@
                 </figure>
                 <div class="card-body flex-[1_1_auto] !p-[1.75rem_1.75rem_1rem_1.75rem] max-md:!p-[40px_40px_20px]">
                   <div class="post-header">
-                    <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
+                    <h2 class="post-title h3 !mt-1 !mb-3"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='blog-post.html'>Ultricies fusce porta elit</a></h2>
                   </div>
                   <!-- /.post-header -->
                   <div class="!relative">
@@ -951,7 +951,7 @@
                <div class="card-footer xl:!p-[1.25rem_1.75rem_1.25rem] lg:!p-[1.25rem_1.75rem_1.25rem] md:!p-[1.25rem_1.75rem_1.25rem] max-md:!p-[0.9rem_2rem]">
                   <ul class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none flex  !mb-0">
                     <li class="post-date inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i><span>26 Feb 2022</span></li>
-                    <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#"><i class="uil uil-file-alt !text-[.75rem] pr-[0.2rem] align-[-.05rem] before:content-['\eaec']"></i>Meeting</a></li>
+                    <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]"><a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#"><i class="uil uil-file-alt !text-[.75rem] pr-[0.2rem] align-[-.05rem] before:content-['\eaec']"></i>Meeting</a></li>
                   </ul>
                   <!-- /.post-meta -->
                 </div>
@@ -972,7 +972,7 @@
       <div class="container py-[5rem] xl:!py-[7rem] lg:!py-[7rem] md:!py-[7rem]">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="md:w-10/12 md:!ml-[8.33333333%] lg:w-8/12 lg:!ml-[16.66666667%] xl:w-8/12 xl:!ml-[16.66666667%] w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Why Choose Trunçgil?</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Why Choose Trunçgil?</h2>
             <h3 class="xl:!text-[2rem] !leading-[1.2] !text-[calc(1.325rem_+_0.9vw)] font-semibold !mb-10 xl:!px-10 xxl:!px-20">Here are a few reasons why our customers choose Trunçgil.</h3>
           </div>
           <!-- /column -->
@@ -1024,11 +1024,11 @@
                 <h2 class="!mb-3 !leading-[1.35]">Easy Usage</h2>
                 <p>Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.</p>
                 <ul class="pl-0 list-none bullet-bg bullet-soft-yellow">
-                  <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+                  <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
                 </ul>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mt-2">Learn More</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mt-2">Learn More</a>
               </div>
               <!--/column -->
             </div>
@@ -1057,11 +1057,11 @@
                 <h2 class="!mb-3 !leading-[1.35]">Fast Transactions</h2>
                 <p>Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.</p>
                 <ul class="pl-0 list-none bullet-bg bullet-soft-green">
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
                 </ul>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mt-2">Learn More</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mt-2">Learn More</a>
               </div>
               <!--/column -->
             </div>
@@ -1090,11 +1090,11 @@
                 <h2 class="!mb-3 !leading-[1.35]">Secure Payments</h2>
                 <p>Etiam porta sem malesuada magna mollis euismod. Donec ullamcorper nulla non metus auctor fringilla. Morbi leo risus, porta ac consectetur ac, vestibulum at eros. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Nullam quis risus eget urna.</p>
                 <ul class="pl-0 list-none bullet-bg bullet-soft-red">
-                  <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
-                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
+                  <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Aenean eu leo quam. Pellentesque ornare.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Nullam quis risus eget urna mollis ornare.</li>
+                  <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i>Donec id elit non mi porta gravida at eget.</li>
                 </ul>
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mt-2">Learn More</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mt-2">Learn More</a>
               </div>
               <!--/column -->
             </div>
@@ -1111,10 +1111,10 @@
       <div class="container pt-20 xl:pt-28 lg:pt-28 md:pt-28">
         <div class="flex flex-wrap mx-[-15px]">
           <div class="xl:w-9/12 xxl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
-            <h2 class="!text-[0.8rem] uppercase !text-[#3f78e0] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Our Team</h2>
+            <h2 class="!text-[0.8rem] uppercase !text-[#e31e24] !mb-3 !leading-[1.35] !tracking-[0.02rem]">Our Team</h2>
             <h3 class="xl:!text-[2rem] !leading-[1.2] !text-[calc(1.325rem_+_0.9vw)] font-semibold lg:!px-32 xl:!px-14 xxl:!px-20 !mb-6">Save your time and money by choosing our professional team.</h3>
             <p class="!mb-8 lg:!px-10 xl:!px-0">Curabitur blandit tempus porttitor. Maecenas faucibus mollis interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas sed diam eget risus varius blandit sit amet non magna.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0]">Read More</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24]">Read More</a>
           </div>
           <!-- /column -->
         </div>
@@ -1198,7 +1198,7 @@
         <div class="flex flex-wrap mx-[-15px]">
           <div class="lg:w-9/12 xl:w-8/12 xxl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto !text-center">
             <h2 class="!text-[0.8rem] !leading-[1.35] !tracking-[0.02rem] uppercase !text-white !mb-3">Join Our Community</h2>
-            <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-semibold !leading-[1.2] xl:!text-[2rem] !text-white !mb-6">We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#3f78e0] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"><em>trusted</em></span> by over 5000+ clients. Join them now and grow your business.</h3>
+            <h3 class="!text-[calc(1.325rem_+_0.9vw)] font-semibold !leading-[1.2] xl:!text-[2rem] !text-white !mb-6">We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[10%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[4%] motion-reduce:after:transition-none after:bg-[#e31e24] after:!bg-[linear-gradient(45deg,#08aeea_0,#2af598_100%)]"><em>trusted</em></span> by over 5000+ clients. Join them now and grow your business.</h3>
             <a href="#" class="btn btn-white">Join Us</a>
           </div>
           <!-- /column -->
@@ -1233,7 +1233,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3 text-[.95rem] !leading-[1.45]">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1242,11 +1242,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3 text-[.95rem] !leading-[1.45]">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1264,7 +1264,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] focus:!border-[rgba(63,120,224,.5)] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !text-[.85rem] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !text-[.85rem] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1288,9 +1288,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/demo33.html b/public/html/demo33.html
index c5324f5..da412f4 100644
--- a/public/html/demo33.html
+++ b/public/html/demo33.html
@@ -712,7 +712,7 @@
           <div class="card-body p-14">
             <div class="flex flex-wrap mx-[-15px] !mt-[-50px] items-center">
               <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!order-2 xl:!ml-[8.33333333%] lg:!order-2 lg:!ml-[8.33333333%] !mt-[50px]">
-                <div class="uppercase !tracking-[0.02rem] text-[0.75rem] font-semibold !mb-3 !text-[#3f78e0]">Mobile Design</div>
+                <div class="uppercase !tracking-[0.02rem] text-[0.75rem] font-semibold !mb-3 !text-[#e31e24]">Mobile Design</div>
                 <h3 class="h1 post-title !mb-3 !leading-[1.3]">Budget App</h3>
                 <p>Maecenas faucibus mollis interdum sed posuere consectetur est at lobortis. Scelerisque id ligula porta felis euismod semper. Fusce dapibus tellus cursus.</p>
                 <a href="#" class="btn btn-sm btn-navy !text-white !bg-[#343f52] border-[#343f52] hover:text-white hover:bg-[#343f52] hover:!border-[#343f52] focus:shadow-[rgba(82,92,108,1)] active:text-white active:bg-[#343f52] active:border-[#343f52] disabled:text-white disabled:bg-[#343f52] disabled:border-[#343f52] btn-icon btn-icon-end !mb-0 !text-[0.75rem]">See Project <i class="uil uil-arrow-up-right before:content-['\e950']"></i></a>
diff --git a/public/html/demo5.html b/public/html/demo5.html
index 602feac..7fcff31 100644
--- a/public/html/demo5.html
+++ b/public/html/demo5.html
@@ -537,7 +537,7 @@
                 <a href="#" class="nav-link" data-bs-toggle="modal" data-bs-target="#modal-signin">Sign In</a>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[.4rem] !text-[.8rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" data-bs-toggle="modal" data-bs-target="#modal-signup">Sign Up</a>
+                <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[.4rem] !text-[.8rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" data-bs-toggle="modal" data-bs-target="#modal-signup">Sign Up</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -567,7 +567,7 @@
                   <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                   <label for="loginPassword1" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
                 </div>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
               </form>
               <!-- /form -->
               <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -613,7 +613,7 @@
                   <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                   <label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
                 </div>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
               </form>
               <!-- /form -->
               <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -641,7 +641,7 @@
             <h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-4">Staying on top of your bills never been this easy</h1>
             <p class="lead !text-[1.05rem] !leading-[1.6] xl:!px-14 xxl:!px-6 !mb-7">Easily achieve your saving goals. Have all your recurring and one time expenses and incomes in one place.</p>
             <div class="flex justify-center" data-cues="slideInDown" data-group="page-title-buttons" data-delay="600">
-              <span><a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded mx-1">Get Started</a></span>
+              <span><a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded mx-1">Get Started</a></span>
               <span><a class="btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  rounded mx-1">Free Trial</a></span>
             </div>
           </div>
@@ -876,7 +876,7 @@
       <div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] !mb-[4.5rem] items-center">
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
+            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] absolute opacity-50  bg-[radial-gradient(#e31e24_2px,transparent_2.5px)]" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !mt-[25px] max-w-full">
                 <figure class="rounded-[0.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[0.4rem]" src="../assets/img/photos/g5.jpg" alt="image"></figure>
@@ -1007,7 +1007,7 @@
     <section class="wrapper !bg-[#ffffff]">
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="pricing-wrapper !relative !mt-[-15rem] xl:!mt-[-20rem] lg:!mt-[-20rem] md:!mt-[-20rem]">
-          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
           <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] hidden xl:block lg:block absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"></div>
           <div class="flex flex-wrap items-center justify-center switcher">
             <p class="!mb-0 !pr-[.75rem]">Monthly</p>
@@ -1022,7 +1022,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
               <div class="pricing card !text-center !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"/><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"/><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"/><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"/></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"/><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"/><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"/><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"/></svg>
                   <h4 class="card-title">Basic Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">mo</span></div>
@@ -1030,13 +1030,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
+                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -1046,7 +1046,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
               <div class="pricing card !text-center !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"/><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"/><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"/><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"/><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"/><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"/></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"/><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"/><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"/><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"/><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"/><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"/></svg>
                   <h4 class="card-title">Premium Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
@@ -1054,13 +1054,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -1070,7 +1070,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 md:!ml-[25%] w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-0 lg:!ml-0 !mt-[30px]">
               <div class="pricing card !text-center !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)]">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" class="svg-inject icon-svg !text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"/><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"/><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"/><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"/><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"/><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"/><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"/><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"/></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" class="svg-inject icon-svg !text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"/><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"/><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"/><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"/><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"/><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"/><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"/><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"/></svg>
                   <h4 class="card-title">Corporate Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
@@ -1078,13 +1078,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -1109,7 +1109,7 @@
         </div>
         <!-- /.row -->
         <div class="flex justify-center" data-cues="slideInDown" data-group="join">
-          <span><a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded mx-1">Get Started</a></span>
+          <span><a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded mx-1">Get Started</a></span>
           <span><a class="btn btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  rounded mx-1">Free Trial</a></span>
         </div>
       </div>
@@ -1141,7 +1141,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1150,11 +1150,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1172,7 +1172,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1196,9 +1196,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/demo9.html b/public/html/demo9.html
index 86ad4e1..e5dbca6 100644
--- a/public/html/demo9.html
+++ b/public/html/demo9.html
@@ -541,7 +541,7 @@
             <ul class="navbar-nav !flex-row !items-center !ml-auto">
               <li class="nav-item"><a class="nav-link" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-info"><i class="uil uil-info-circle before:content-['\eb99'] !text-[1.1rem]"></i></a></li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="#modal-signin">Sign In</a>
+                <a href="#" class="btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem]" data-bs-toggle="modal" data-bs-target="#modal-signin">Sign In</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -571,7 +571,7 @@
                   <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                   <label for="loginPassword1" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
                 </div>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
               </form>
               <!-- /form -->
               <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -617,7 +617,7 @@
                   <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                   <label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
                 </div>
-                <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
               </form>
               <!-- /form -->
               <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -649,16 +649,16 @@
           <div class="widget !mb-8">
             <h4 class="widget-title !text-white !mb-[0.75rem] !text-[.95rem] !leading-[1.45]">Contact Info</h4>
             <address class=" not-italic !leading-[inherit] !mb-[1rem]"> Moonshine St. 14/05 <br> Light City, London </address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
           <div class="widget !mb-8">
             <h4 class="widget-title !text-white !mb-[0.75rem] !text-[.95rem] !leading-[1.45]">Learn More</h4>
             <ul class="list-unstyled !pl-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
-              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Contact Us</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
+              <li class="!mt-[.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Contact Us</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -684,10 +684,10 @@
       <div class="container pt-10 pb-14 xl:pt-[4.5rem] lg:pt-[4.5rem] md:pt-[4.5rem] xl:pb-28 lg:pb-28 md:pb-28">
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
           <div class="md:w-10/12 md:!ml-[8.33333333%] lg:!ml-0 lg:w-5/12 xl:!ml-0 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[50px] max-w-full lg:!mt-[-.5rem] xl:!mt-[-.5rem] text-center lg:text-left xl:text-left order-2 lg:!order-none xl:!order-none" data-cues="slideInDown" data-group="page-title" data-delay="600">
-            <h1 class="xl:!text-[2.6rem] !text-[calc(1.385rem_+_1.62vw)] !leading-[1.1] !font-DMSerif !font-normal !tracking-normal [word-spacing:normal!important] !mb-5 md:mx-10 lg:mx-0">Trunçgil is effortless and powerful with <br><span class="typer !text-[#3f78e0]  whitespace-nowrap" data-delay="100" data-words="easy usage,fast transactions,secure payments"></span><span class="cursor !text-[#3f78e0] " data-owner="typer"></span></h1>
+            <h1 class="xl:!text-[2.6rem] !text-[calc(1.385rem_+_1.62vw)] !leading-[1.1] !font-DMSerif !font-normal !tracking-normal [word-spacing:normal!important] !mb-5 md:mx-10 lg:mx-0">Trunçgil is effortless and powerful with <br><span class="typer !text-[#e31e24]  whitespace-nowrap" data-delay="100" data-words="easy usage,fast transactions,secure payments"></span><span class="cursor !text-[#e31e24] " data-owner="typer"></span></h1>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium !mb-7">Achieve your saving goals. Have all your recurring and one time expenses and incomes in one place.</p>
             <div class="flex justify-center lg:!justify-start xl:!justify-start" data-cues="slideInDown" data-group="page-title-buttons" data-delay="900">
-              <span><a class="btn btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded !mr-2">Get Started</a></span>
+              <span><a class="btn btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded !mr-2">Get Started</a></span>
               <span><a class="btn btn-lg btn-green !text-white !bg-[#45c4a0] border-[#45c4a0] hover:text-white hover:bg-[#45c4a0] hover:!border-[#45c4a0]   active:text-white active:bg-[#45c4a0] active:border-[#45c4a0] disabled:text-white disabled:bg-[#45c4a0] disabled:border-[#45c4a0]  rounded">Free Trial</a></span>
             </div>
           </div>
@@ -1038,7 +1038,7 @@
       <div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
         <div class="flex flex-wrap mx-[-15px] max-sm:!mt-[-50px] !mt-[-80px] xl:mx-[-7.5px] lg:mx-[-7.5px] items-center !mb-[4.5rem] xl:!mb-[9rem] lg:!mb-[9rem] md:!mb-[9rem]">
           <div class="md:w-8/12 lg:w-6/12 xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[7.5px] lg:!px-[7.5px] !mt-[80px] max-w-full !relative">
-            <a href="../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#3f78e0] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#3f78e0] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
+            <a href="../assets/media/movie.mp4" class="btn btn-circle btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-play ripple !mx-auto !mb-5 !absolute xl:!text-[2.3rem] !text-[calc(1.355rem_+_1.26vw)] w-[3.5rem] h-[3.5rem] !inline-flex !items-center !justify-center !leading-none !p-0 !rounded-[100%] before:content-[''] before:block before:absolute before:opacity-80 before:animate-[ripple-1_2s_infinite_ease-in-out] before:z-[-1] before:rounded-[50%] before:inset-0 before:bg-[#e31e24] after:opacity-60 after:animate-[ripple-2_2s_infinite_ease-in-out] after:content-[''] after:block after:absolute after:z-[-1] after:rounded-[50%] after:inset-0 after:bg-[#e31e24] after:[animation-delay:.5s]" style="top:50%; left: 50%; transform: translate(-50%,-50%); z-index:3;" data-glightbox><i class="icn-caret-right !ml-[0.15rem] !relative z-[2] before:content-['\e900'] !text-[calc(1.355rem_+_1.26vw)]"></i></a>
             <div class="shape !rounded-[.4rem] !bg-[#edf2fc] rellax xl:block lg:block md:block !absolute z-[1]" data-rellax-speed="0" style="bottom: -1.8rem; right: -1.5rem; width: 85%; height: 90%; "></div>
             <figure class="rounded-[0.4rem] relative z-[2]"><img class="rounded-[0.4rem]" src="../assets/img/photos/about8.jpg" alt="image"></figure>
           </div>
@@ -1081,8 +1081,8 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
             <h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !tracking-[0.02rem] !leading-[1.35]">Our Pricing</h2>
             <h3 class="xl:!text-[2rem] !text-[calc(1.325rem_+_0.9vw)] !leading-[1.2] !font-DMSerif !font-normal !tracking-normal [word-spacing:normal!important] !mb-[1.25rem]">We offer great and premium prices.</h3>
-            <p class="!mb-[1.25rem]">Enjoy a <a href="#" class="hover !text-[#3f78e0]">free 30-day trial</a> and experience the full service. No credit card required!</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !text-[.85rem] !rounded-[.4rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
+            <p class="!mb-[1.25rem]">Enjoy a <a href="#" class="hover !text-[#e31e24]">free 30-day trial</a> and experience the full service. No credit card required!</p>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !text-[.85rem] !rounded-[.4rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
           </div>
           <!--/column -->
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
@@ -1091,7 +1091,7 @@
               <div class="pricing-switchers w-8 h-4 clear-both !text-center !relative bg-[rgba(30,34,40,0.07)] !box-content rounded-3xl border-[0.2rem] border-solid border-transparent">
                 <div class="pricing-switcher pricing-switcher-active cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase !text-white"></div>
                 <div class="pricing-switcher cursor-pointer w-full float-left h-4 leading-4 !relative z-[888] transition-[0.3s] duration-[ease-in-out] uppercase"></div>
-                <div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[#3f78e0] opacity-100 switcher-button"></div>
+                <div class="h-4 w-4 block absolute z-[555] transition-[0.3s] duration-[ease-in-out] m-0 rounded-[100%] border-[none] left-0 top-0 !bg-[#e31e24] opacity-100 switcher-button"></div>
               </div>
               <p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
             </div>
@@ -1106,13 +1106,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Premium Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-[1.5rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-[1.5rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                       <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !text-[.85rem] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !text-[.85rem] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -1129,13 +1129,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Corporate Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-[1.5rem] !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !text-[.85rem] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !text-[.85rem] !rounded-[.4rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -1167,7 +1167,7 @@
             <div id="accordion-3" class="accordion-wrapper">
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-1">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-1" aria-expanded="false" aria-controls="accordion-collapse-3-1">How do I get my subscription receipt?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-1" class="collapse" aria-labelledby="accordion-heading-3-1" data-bs-target="#accordion-3">
@@ -1181,7 +1181,7 @@
               <!-- /.card -->
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-2">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-2" aria-expanded="false" aria-controls="accordion-collapse-3-2">Are there any discounts for people in need?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-2" class="collapse" aria-labelledby="accordion-heading-3-2" data-bs-target="#accordion-3">
@@ -1195,7 +1195,7 @@
               <!-- /.card -->
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-3">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-3" aria-expanded="false" aria-controls="accordion-collapse-3-3">Do you offer a free trial edit?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-3" class="collapse" aria-labelledby="accordion-heading-3-3" data-bs-target="#accordion-3">
@@ -1209,7 +1209,7 @@
               <!-- /.card -->
               <div class="card accordion-item !shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.07)] !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 bg-inherit" id="accordion-heading-3-4">
-                  <button class="before:!text-[#3f78e0] hover:!text-[#3f78e0] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
+                  <button class="before:!text-[#e31e24] hover:!text-[#e31e24] collapsed" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-3-4" aria-expanded="false" aria-controls="accordion-collapse-3-4">How do I reset my Account password?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-3-4" class="collapse" aria-labelledby="accordion-heading-3-4" data-bs-target="#accordion-3">
@@ -1256,7 +1256,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1265,11 +1265,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1287,7 +1287,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1311,9 +1311,9 @@
     <!-- /.container -->
   </footer>
   <!-- progress wrapper -->
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/onepage.html b/public/html/onepage.html
index fdfeb68..84624bc 100644
--- a/public/html/onepage.html
+++ b/public/html/onepage.html
@@ -66,13 +66,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -146,7 +146,7 @@
           <!--/.row -->
         <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-30px] xl:!mt-0 lg:!mt-0 md:!mt-0 !text-center">
           <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] max-w-full max-md:!mt-[30px]">
-            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#3f78e0] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
+            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 362.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/megaphone.svg" class="svg-inject icon-svg icon-svg-md !w-[2.6rem] !h-[2.6rem] text-[#e31e24] text-blue !mb-3  m-[0_auto]"><path class="lineal-stroke" d="M343.4 302.9L61 302.5c-25.3-.2-47.5-16.8-54.8-40.9l-3.9-12.9c-7.1-24.2 2.5-50.3 23.5-64.2L262.1 29.8c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.3 249.8c2.4 6.4-.9 13.5-7.3 15.8-1.3.5-2.8.7-4.2.7zM261.8 59.4L39.3 205c-12 7.9-17.4 22.8-13.4 36.6l3.8 12.9c4.2 13.8 16.8 23.3 31.2 23.4l265.8.4-64.9-218.9z"></path><path class="lineal-stroke" d="M138 362.5c-40.4 0-72.8-31.1-73.6-70.8 0-6.8 5.5-12.3 12.3-12.3 6.6 0 12.1 5.2 12.3 11.8.6 26.2 22.1 46.7 49 46.7 14.2 0 27.7-6.2 37-16.9 4.5-5.1 12.2-5.7 17.4-1.2 5.1 4.5 5.7 12.2 1.2 17.4-14 16.1-34.3 25.3-55.6 25.3z"></path><path class="lineal-fill" d="M183.4 96l57.8 194.5 102.1.1-74.5-250.5L183.4 96z"></path><path class="lineal-stroke" d="M343.4 302.9l-102.1-.1c-5.4 0-10.2-3.6-11.8-8.8L171.6 99.5c-1.6-5.2.5-10.8 5.1-13.8l85.4-55.9c5.7-3.7 13.3-2.1 17 3.6.7 1 1.2 2.1 1.5 3.2l74.5 250.6c1.9 6.5-1.8 13.4-8.3 15.3-1.1.2-2.3.4-3.4.4zm-92.9-24.7l76.4.1-65.1-218.9-63.9 41.8 52.6 177z"></path><path class="lineal-stroke" d="M351.8 330.6c-5.4 0-10.2-3.6-11.8-8.8l-91-306c-2.1-6.5 1.3-13.4 7.8-15.6 6.5-2.1 13.4 1.3 15.6 7.8.1.3.2.5.2.8l91 305.9c1.9 6.5-1.8 13.4-8.3 15.3-1.1.4-2.3.6-3.5.6zM338 91.7c-6.8 0-12.3-5.5-12.3-12.3 0-1.8.4-3.6 1.2-5.3l13.4-28.5c2.9-6.2 10.2-8.8 16.4-5.9 6.2 2.9 8.8 10.2 5.9 16.4l-13.4 28.5c-2.1 4.3-6.4 7.1-11.2 7.1zm28.2 64.9c-6.8 0-12.3-5.5-12.3-12.3 0-5.7 3.9-10.6 9.4-12l31.1-7.5c6.6-1.5 13.2 2.6 14.7 9.3 1.5 6.5-2.5 13-9 14.7l-31.2 7.4c-.8.3-1.8.4-2.7.4zm29.1 90c-2.7 0-5.4-.9-7.5-2.6l-24.9-19.4c-5.4-4.2-6.3-11.9-2.2-17.3s11.9-6.3 17.3-2.2l24.9 19.4c5.4 4.2 6.3 11.9 2.1 17.3-2.3 3-5.9 4.7-9.7 4.8z"></path></svg>
             <h4>Marketing</h4>
             <p class="!mb-2">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget metus. Cras justo cum sociis natoque magnis.</p>
           </div>
@@ -186,11 +186,11 @@
             </div>
             <!--/column -->
             <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">How It Works?</h2>
+              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">How It Works?</h2>
               <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7 xxl:!pr-5">Everything you need on creating a business process.</h3>
               <div class="flex flex-row !mb-4">
                 <div>
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  text-[#3f78e0] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg !w-[2.2rem] !h-[2.2rem]  text-[#e31e24] !mr-4"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
                 </div>
                 <div>
                   <h4 class="!mb-1">Collect Ideas</h4>
@@ -225,12 +225,12 @@
             </div>
             <!--/column -->
             <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Why Choose Us?</h2>
+              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Why Choose Us?</h2>
               <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">A few reasons why our valued customers choose us.</h3>
               <div class="accordion accordion-wrapper" id="accordionExample">
                 <div class="card plain accordion-item">
                   <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingOne">
-                    <button class="accordion-button hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
+                    <button class="accordion-button hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Professional Design </button>
                   </div>
                   <!--/.card-header -->
                   <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne" data-bs-parent="#accordionExample">
@@ -244,7 +244,7 @@
                 <!--/.accordion-item -->
                 <div class="card plain accordion-item">
                   <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingTwo">
-                    <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
+                    <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Top-Notch Support </button>
                   </div>
                   <!--/.card-header -->
                   <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo" data-bs-parent="#accordionExample">
@@ -258,7 +258,7 @@
                 <!--/.accordion-item -->
                 <div class="card plain accordion-item">
                   <div class="card-header !mb-0 !p-[0_0_.8rem_0] !border-0 !bg-inherit" id="headingThree">
-                    <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
+                    <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Header and Slider Options </button>
                   </div>
                   <!--/.card-header -->
                   <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree" data-bs-parent="#accordionExample">
@@ -287,10 +287,10 @@
         <div class="container py-[4.5rem] xl:!py-28 lg:!py-28 md:!py-28">
           <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] !mt-[-50px] items-center">
             <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Meet the Team</h2>
+              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Meet the Team</h2>
               <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-5">Save your time and money by choosing our professional team.</h3>
               <p>Donec id elit non mi porta gravida at eget metus. Morbi leo risus, porta ac consectetur ac, vestibulum at eros tempus porttitor.</p>
-              <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
+              <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Members</a>
             </div>
             <!--/column -->
             <div class="xl:w-8/12 lg:w-8/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
@@ -481,11 +481,11 @@
             </div>
             <!--/column -->
             <div class="xl:w-5/12 lg:w-5/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full">
-              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0] !text-[#3f78e0] !mb-3">Get In Touch</h2>
+              <h2 class="!text-[.75rem] uppercase text-line relative align-top !pl-[1.4rem] inline-flex !tracking-[0.02rem] !leading-[1.35] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24] !text-[#e31e24] !mb-3">Get In Touch</h2>
               <h3 class="!text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3] !mb-7">Got any questions? Don't hesitate to get in touch.</h3>
               <div class="flex flex-row">
                 <div>
-                  <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                  <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                 </div>
                 <div>
                   <h5 class="!mb-1">Address</h5>
@@ -494,7 +494,7 @@
               </div>
               <div class="flex flex-row">
                 <div>
-                  <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                  <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                 </div>
                 <div>
                   <h5 class="!mb-1">Phone</h5>
@@ -503,7 +503,7 @@
               </div>
               <div class="flex flex-row">
                 <div>
-                  <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                  <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
                 </div>
                 <div>
                   <h5 class="!mb-1">E-mail</h5>
@@ -545,7 +545,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -554,11 +554,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -576,7 +576,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -599,9 +599,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/page-loader.html b/public/html/page-loader.html
index f7b1267..5be435b 100644
--- a/public/html/page-loader.html
+++ b/public/html/page-loader.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -705,7 +705,7 @@
             <p>Nulla vitae elit libero elit non porta gravida eget metus cras. Aenean eu leo quam. Pellentesque ornare.</p>
           </div>
           <!--/column -->
-          <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"><span class="number">02</span></span>
+          <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"><span class="number">02</span></span>
             <h4 class="!mb-1">Prepare</h4>
             <p>Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.</p>
           </div>
@@ -747,7 +747,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!mt-32 lg:!mt-32 !mb-3">Our Pricing</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">We offer <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">great prices</span>, premium and quality products for your business.</p>
             <p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
           </div>
           <!--/column -->
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
@@ -761,7 +761,7 @@
               <p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
             </div>
             <div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
-              <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] !absolute z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
+              <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] !absolute z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
               <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="pricing card">
@@ -773,13 +773,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Premium Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                       <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -796,13 +796,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Corporate Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -817,7 +817,7 @@
         <!--/.row -->
         <div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] items-center">
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
+            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
                 <figure class="!rounded-[.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[.4rem]" src="../assets/img/photos/g5.jpg" alt="image"></figure>
@@ -852,7 +852,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">trusted by</span> over 5000+ clients. Join them by using our services and grow your business.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
           </div>
           <!--/column -->
         </div>
@@ -886,7 +886,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -895,11 +895,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -917,7 +917,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -940,9 +940,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/pricing.html b/public/html/pricing.html
index a542b30..3934cd5 100644
--- a/public/html/pricing.html
+++ b/public/html/pricing.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -574,7 +574,7 @@
     <section class="wrapper">
       <div class="container !pb-[4.5rem] xl:!pb-24 lg:!pb-24 md:!pb-24">
         <div class="pricing-wrapper !relative !mt-[-8rem] xl:!mt-[-12.5rem] lg:!mt-[-12.5rem] md:!mt-[-12.5rem]  !mb-14 xl:!mb-20 lg:!mb-20 md:!mb-20">
-          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
           <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] hidden xl:block lg:block absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"></div>
           <div class="flex flex-wrap items-center justify-center pricing-switcher-wrapper switcher">
             <p class="!mb-0 !pr-[.75rem]">Monthly</p>
@@ -589,7 +589,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
                   <h4 class="card-title">Basic Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">mo</span></div>
@@ -597,13 +597,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
+                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -613,7 +613,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
                   <h4 class="card-title">Premium Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
@@ -621,13 +621,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -637,7 +637,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 md:!ml-[25%] w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-0 lg:!ml-0 !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                   <h4 class="card-title">Corporate Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
@@ -645,13 +645,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -666,7 +666,7 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full">
             <div class="flex flex-row">
               <div>
-                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-phone-volume before:content-['\ec50'] text-[1rem] leading-none"></i> </div>
+                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-phone-volume before:content-['\ec50'] text-[1rem] leading-none"></i> </div>
               </div>
               <div>
                 <h4>24/7 Support</h4>
@@ -679,7 +679,7 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full">
             <div class="flex flex-row">
               <div>
-                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-laptop-cloud before:content-['\ebb2'] text-[1rem] leading-none"></i> </div>
+                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-laptop-cloud before:content-['\ebb2'] text-[1rem] leading-none"></i> </div>
               </div>
               <div>
                 <h4>Daily Updates</h4>
@@ -692,7 +692,7 @@
           <div class="xl:w-4/12 lg:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[30px] max-w-full">
             <div class="flex flex-row">
               <div>
-                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-chart-line before:content-['\e9d3'] text-[1rem] leading-none"></i> </div>
+                <div class="icon btn btn-circle pointer-events-none btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !mr-4 !w-[2.2rem] !h-[2.2rem] !inline-flex !items-center !justify-center !text-[1rem] !leading-none !p-0 !rounded-[100%]"> <i class="uil uil-chart-line before:content-['\e9d3'] text-[1rem] leading-none"></i> </div>
               </div>
               <div>
                 <h4>Market Research</h4>
@@ -711,7 +711,7 @@
             <div id="accordion-1" class="accordion-wrapper">
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-1">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-1" aria-expanded="false" aria-controls="accordion-collapse-1-1">Can I cancel my subscription?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-1" aria-expanded="false" aria-controls="accordion-collapse-1-1">Can I cancel my subscription?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-1" class="collapse" aria-labelledby="accordion-heading-1-1" data-bs-target="#accordion-1">
@@ -725,7 +725,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-2">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-2" aria-expanded="false" aria-controls="accordion-collapse-1-2">Which payment methods do you accept?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-2" aria-expanded="false" aria-controls="accordion-collapse-1-2">Which payment methods do you accept?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-2" class="collapse" aria-labelledby="accordion-heading-1-2" data-bs-target="#accordion-1">
@@ -739,7 +739,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-3">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-3" aria-expanded="false" aria-controls="accordion-collapse-1-3">How can I manage my Account?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-3" aria-expanded="false" aria-controls="accordion-collapse-1-3">How can I manage my Account?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-3" class="collapse" aria-labelledby="accordion-heading-1-3" data-bs-target="#accordion-1">
@@ -753,7 +753,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-1-4">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-4" aria-expanded="false" aria-controls="accordion-collapse-1-4">Is my credit card information secure?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-1-4" aria-expanded="false" aria-controls="accordion-collapse-1-4">Is my credit card information secure?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-1-4" class="collapse" aria-labelledby="accordion-heading-1-4" data-bs-target="#accordion-1">
@@ -773,7 +773,7 @@
             <div id="accordion-2" class="accordion-wrapper">
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-1">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-1" aria-expanded="false" aria-controls="accordion-collapse-2-1">How do I get my subscription receipt?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-1" aria-expanded="false" aria-controls="accordion-collapse-2-1">How do I get my subscription receipt?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-1" class="collapse" aria-labelledby="accordion-heading-2-1" data-bs-target="#accordion-2">
@@ -787,7 +787,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-2">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-2" aria-expanded="false" aria-controls="accordion-collapse-2-2">Are there any discounts for people in need?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-2" aria-expanded="false" aria-controls="accordion-collapse-2-2">Are there any discounts for people in need?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-2" class="collapse" aria-labelledby="accordion-heading-2-2" data-bs-target="#accordion-2">
@@ -801,7 +801,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-3">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-3" aria-expanded="false" aria-controls="accordion-collapse-2-3">Do you offer a free trial edit?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-3" aria-expanded="false" aria-controls="accordion-collapse-2-3">Do you offer a free trial edit?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-3" class="collapse" aria-labelledby="accordion-heading-2-3" data-bs-target="#accordion-2">
@@ -815,7 +815,7 @@
               <!-- /.card -->
               <div class="card accordion-item !mb-5">
                 <div class="card-header !mb-0 !p-[.9rem_1.3rem_.85rem] !border-0 !bg-inherit" id="accordion-heading-2-4">
-                  <button class="collapsed hover:!text-[#3f78e0]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-4" aria-expanded="false" aria-controls="accordion-collapse-2-4">How do I reset my Account password?</button>
+                  <button class="collapsed hover:!text-[#e31e24]" data-bs-toggle="collapse" data-bs-target="#accordion-collapse-2-4" aria-expanded="false" aria-controls="accordion-collapse-2-4">How do I reset my Account password?</button>
                 </div>
                 <!-- /.card-header -->
                 <div id="accordion-collapse-2-4" class="collapse" aria-labelledby="accordion-heading-2-4" data-bs-target="#accordion-2">
@@ -837,7 +837,7 @@
         <p class="lead text-[0.9rem] font-medium !leading-[1.65] !text-center !mb-6 md:!px-24 lg:!px-0">Customer satisfaction is our major goal. See what our customers are saying about us.</p>
         <div class="!relative">
           <div class="shape !rounded-[50%] !bg-[#fff8ee] rellax !w-[6rem] !h-[6rem] absolute z-[1]" data-rellax-speed="1" style="bottom: 0.5rem; right: -1.7rem;"></div>
-          <div class="shape bg-dot primary rellax !w-[6rem] !h-[6rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -1.7rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[6rem] !h-[6rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -1.7rem;"></div>
           <div class="swiper-container dots-closer !mb-6" data-margin="0" data-dots="true" data-items-xl="3" data-items-md="2" data-items-xs="1">
             <div class="swiper">
               <div class="swiper-wrapper">
@@ -991,7 +991,7 @@
           <div class="lg:w-6/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3 !text-center">Join Our Community</h2>
             <p class="lead text-[0.9rem] font-medium !leading-[1.65] !mb-5 xl:!px-3 lg:!px-3 md:!px-24">We are trusted by over 5000+ clients. Join them by using our services and grow your business.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
           </div>
           <!-- /column -->
         </div>
@@ -1025,7 +1025,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1034,11 +1034,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1056,7 +1056,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1079,9 +1079,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/projects.html b/public/html/projects.html
index 3cc27b1..dfda72c 100644
--- a/public/html/projects.html
+++ b/public/html/projects.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -798,7 +798,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -807,11 +807,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -829,7 +829,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -852,9 +852,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/projects2.html b/public/html/projects2.html
index ee85004..3892c2e 100644
--- a/public/html/projects2.html
+++ b/public/html/projects2.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -806,7 +806,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -815,11 +815,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -837,7 +837,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -860,9 +860,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/projects3.html b/public/html/projects3.html
index 8b9cedb..d550bce 100644
--- a/public/html/projects3.html
+++ b/public/html/projects3.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -577,10 +577,10 @@
             <p class=" inline m-[0_1rem_0_0] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc]">Filter:</p>
             <ul class=" inline m-0 p-0 list-none">
               <li class="inline"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer active" data-filter="*">All</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".concept">Concept</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".product">Product</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".workshop">Workshop</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".still-life">Still Life</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".concept">Concept</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".product">Product</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".workshop">Workshop</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".still-life">Still Life</a></li>
             </ul>
           </div>
           <div class="flex flex-wrap mx-[-15px] xl:mx-[-25px] lg:mx-[-25px] md:mx-[-25px] !mt-[-50px] xl:!mt-[-80px] lg:!mt-[-80px] md:!mt-[-80px] isotope">
@@ -737,7 +737,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -746,11 +746,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -768,7 +768,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -791,9 +791,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/projects4.html b/public/html/projects4.html
index fb7032d..ee2fc7b 100644
--- a/public/html/projects4.html
+++ b/public/html/projects4.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -578,10 +578,10 @@
             <p class=" inline m-[0_1rem_0_0] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc]">Filter:</p>
             <ul class=" inline m-0 p-0 list-none">
               <li class="inline"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer active" data-filter="*">All</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".concept">Concept</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".product">Product</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".workshop">Workshop</a></li>
-              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#3f78e0]" data-filter=".still-life">Still Life</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".concept">Concept</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".product">Product</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".workshop">Workshop</a></li>
+              <li class="inline before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:ml-2 before:mr-[0.8rem] before:my-0 before:rounded-[100%] before:bg-[rgba(30,34,40,.2)] before:align-[.15rem]"><a class="filter-item uppercase !tracking-[0.02rem] text-[0.7rem] font-bold cursor-pointer hover:!text-[#e31e24]" data-filter=".still-life">Still Life</a></li>
             </ul>
           </div>
           <div class="flex flex-wrap mx-[-15px] xl:mx-[-20px] lg:mx-[-20px] md:mx-[-20px] !mt-[-50px] xl:!mt-[-80px] lg:!mt-[-80px] md:!mt-[-80px] isotope">
@@ -726,7 +726,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -735,11 +735,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -757,7 +757,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -780,9 +780,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/services.html b/public/html/services.html
index edefcd3..14ac0e7 100644
--- a/public/html/services.html
+++ b/public/html/services.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -704,7 +704,7 @@
             <p>Nulla vitae elit libero elit non porta gravida eget metus cras. Aenean eu leo quam. Pellentesque ornare.</p>
           </div>
           <!--/column -->
-          <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"><span class="number">02</span></span>
+          <div class="md:w-6/12 lg:w-3/12 xl:w-3/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[30px] max-w-full !relative after:w-full after:absolute after:content-[''] after:h-px after:z-[1] after:border-t-[rgba(164,174,198,0.2)] after:border-t after:border-solid after:left-[3rem] after:top-6 after:bg-inherit max-lg:after:!hidden"> <span class="icon btn btn-circle btn-lg btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] pointer-events-none !mb-4 !relative z-[2] xl:!text-[1.3rem] w-12 h-12 !text-[calc(1.255rem_+_0.06vw)] inline-flex items-center justify-center leading-none p-0 !rounded-[100%]"><span class="number">02</span></span>
             <h4 class="!mb-1">Prepare</h4>
             <p>Vestibulum id ligula porta felis euismod semper. Sed posuere consectetur est at lobortis.</p>
           </div>
@@ -746,7 +746,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] xl:!mt-32 lg:!mt-32 !mb-3">Our Pricing</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">We offer <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">great prices</span>, premium and quality products for your business.</p>
             <p>Enjoy a <a href="#" class="hover">free 30-day trial</a> and experience the full service. No credit card required!</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">See All Prices</a>
           </div>
           <!--/column -->
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full xl:!ml-[8.33333333%] lg:!ml-[8.33333333%] pricing-wrapper !mt-[30px]">
@@ -760,7 +760,7 @@
               <p class="!mb-0 !pl-3 !relative">Yearly <span class="!text-[#e2626b]">(Save 30%)</span></p>
             </div>
             <div class="flex flex-wrap mx-[-15px] !mt-[25px] !relative">
-              <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] !absolute z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
+              <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] !absolute z-[1] opacity-50 !px-[15px] !mt-[30px]" data-rellax-speed="1" style="bottom: -0.5rem; right: -1.6rem;"></div>
               <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: -1rem; left: -2rem;"></div>
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
                 <div class="pricing card">
@@ -772,13 +772,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Premium Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                       <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -795,13 +795,13 @@
                     <!--/.prices -->
                     <h4 class="card-title !mt-2">Corporate Plan</h4>
                     <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8">
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                      <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                     </ul>
-                    <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                    <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                   </div>
                   <!--/.card-body -->
                 </div>
@@ -816,7 +816,7 @@
         <!--/.row -->
         <div class="flex flex-wrap mx-[-15px] !mt-[-50px] xl:mx-[-35px] lg:mx-[-20px] items-center">
           <div class="xl:w-7/12 lg:w-7/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] !mt-[50px] max-w-full !relative">
-            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
+            <div class="shape bg-dot primary rellax !w-[8rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 0; left: -1.4rem; z-index: 0;"></div>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-12.5px] lg:mx-[-12.5px] md:mx-[-12.5px] !mt-[-25px]">
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] px-[12.5px] !mt-[25px] max-w-full">
                 <figure class="!rounded-[.4rem] xl:!mt-10 lg:!mt-10 md:!mt-10 !relative"><img class="!rounded-[.4rem]" src="../assets/img/photos/g5.jpg" alt="image"></figure>
@@ -851,7 +851,7 @@
             <h2 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3] !mb-3">Let’s Talk</h2>
             <p class="lead !text-[1.05rem] !leading-[1.6] font-medium">Let's make something great together. We are <span class="relative z-[2] whitespace-nowrap after:content-[''] after:block after:absolute after:w-[102.5%] after:h-[30%] after:left-[-1.5%] after:z-[-1] after:transition-all after:duration-[0.2s] after:ease-in-out after:!mt-0 after:rounded-[5rem] after:bottom-[9%] motion-reduce:after:transition-none after:bg-[rgba(63,120,224,.12)]">trusted by</span> over 5000+ clients. Join them by using our services and grow your business.</p>
             <p>Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Maecenas faucibus mollis interdum. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</p>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mt-2 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Join Us</a>
           </div>
           <!--/column -->
         </div>
@@ -885,7 +885,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -894,11 +894,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -916,7 +916,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -939,9 +939,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/services2.html b/public/html/services2.html
index c420170..9c0e5aa 100644
--- a/public/html/services2.html
+++ b/public/html/services2.html
@@ -537,9 +537,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle hover:!text-[#ffffffb3]" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
@@ -616,7 +616,7 @@
               <div class="xl:w-6/12 lg:w-6/12 md:w-6/12 w-full flex-[0_0_auto] xl:!px-[12.5px] lg:!px-[12.5px] md:!px-[12.5px] !px-[15px] max-w-full !self-start !mt-[25px]">
                 <div class="card !bg-[#e0e9fa]">
                   <div class="card-body p-[40px]">
-                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/analytics.svg" class="svg-inject icon-svg icon-svg-md text-[#3f78e0] text-primary !mb-3 !w-[2.6rem] !h-[2.6rem]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"></path><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"></path><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"></path></svg>
+                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 427.5" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/analytics.svg" class="svg-inject icon-svg icon-svg-md text-[#e31e24] text-primary !mb-3 !w-[2.6rem] !h-[2.6rem]"><path class="lineal-fill" d="M186.9 353.4h138.3V413H186.9z"></path><path class="lineal-stroke" d="M460.2 0H51.8C23.2 0 0 23.2 0 51.8v264.4c0 28.6 23.2 51.7 51.8 51.8h120.6v30.6h-28.8c-8 0-14.5 6.5-14.5 14.5s6.5 14.5 14.5 14.5h224.9c8 0 14.5-6.5 14.5-14.5s-6.5-14.5-14.5-14.5h-28.8v-45.1c0-8-6.5-14.5-14.5-14.5H51.8C39.2 339 29 328.8 29 316.2V51.8C29 39.2 39.2 29 51.8 29h408.5c12.6 0 22.8 10.2 22.8 22.8v264.4c0 12.6-10.2 22.8-22.8 22.8h-45.9c-8-.2-14.6 6.1-14.8 14.1-.2 8 6.1 14.6 14.1 14.8h46.7c28.6 0 51.7-23.2 51.8-51.8V51.8C512 23.2 488.8 0 460.2 0zM201.3 398.5v-30.6h109.4v30.6H201.3z"></path><path class="lineal-fill" d="M218.2 291.3h-75.6v-90.6c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v90.6zm75.6 0h-75.6V155.4c0-20.9 16.9-37.8 37.8-37.8s37.8 16.9 37.8 37.8v135.9z"></path><path class="lineal-stroke" d="M369.4 215.4c8 0 14.4-6.4 14.5-14.4v-91c0-28.9-23.5-52.2-52.3-52.2-28.3 0-51.4 22.6-52.2 50.8-25.8-12.9-57.1-2.5-70.1 23.3-3.4 6.9-5.3 14.4-5.5 22.1-25.8-12.9-57.2-2.5-70.1 23.3-3.6 7.3-5.5 15.3-5.5 23.4v90.6c0 8 6.5 14.5 14.5 14.5h226.7c8 .2 14.6-6.1 14.8-14.1.2-8-6.1-14.6-14.1-14.8h-61.9V110c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v91c.1 8 6.6 14.4 14.6 14.4zm-212.3-14.7c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v76.1h-46.6v-76.1zm75.6 0v-45.4c0-12.9 10.4-23.3 23.3-23.3s23.3 10.4 23.3 23.3v121.5h-46.6v-76.1z"></path></svg>
                     <h4>Market Research</h4>
                     <p class="!mb-0">Nulla vitae elit libero, a pharetra augue. Donec id elit non mi porta gravida at eget.</p>
                   </div>
@@ -663,7 +663,7 @@
             <h2 class="!text-[.75rem] uppercase !text-[#aab0bc] !mb-3 !mt-[3.5rem] !tracking-[0.02rem]">Our Process</h2>
             <h3 class="!text-[calc(1.305rem_+_0.66vw)] font-bold xl:!text-[1.8rem] !leading-[1.3]  !mb-0 !text-center xl:!px-10 xxl:!px-20">Find out everything you need to know about creating a business process model</h3>
             <div class="flex flex-wrap mx-[-15px] xl:mx-[-35px] lg:mx-[-20px] process-wrapper !text-center !mt-9">
-              <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
+              <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] xl:!px-[35px] lg:!px-[20px] !px-[15px] max-w-full"> <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 321.7 409.6" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/light-bulb.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M160.9 221.3c-19.1 0-37.4-7.3-51.3-20.4l51.3 127.2 51.3-127.2c-13.9 13.1-32.3 20.4-51.3 20.4z"></path><path class="lineal-stroke" d="M160.9 339.9c-4.8 0-9.1-2.9-10.9-7.4L98.6 205.3c-2.5-6 .3-12.9 6.3-15.4 4.3-1.8 9.3-.9 12.7 2.4 24.3 22.9 62.2 22.9 86.5 0 4.7-4.5 12.1-4.3 16.6.3 3.2 3.4 4.2 8.3 2.4 12.7l-51.4 127.2c-1.7 4.5-6 7.4-10.8 7.4zm-27.5-111.3l27.5 68.1 27.5-68.1c-17.9 5.9-37.2 5.9-55 0z"></path><path class="lineal-stroke" d="M86.7 316.1c-5.9 0-10.9-4.4-11.7-10.2-2.2-16.6-9.8-23.9-22.3-36.1l-2.9-2.8C28.8 246.5 0 218.4 0 151.6c0-42.9 17.1-81.9 48-110C77.7 14.8 117.7 0 160.9 0s83.2 14.8 112.8 41.6c6.7 6.1 12.8 12.7 18.3 19.9 3.1 4.1 6 8.3 8.6 12.6 1.3 2.2 2.6 4.4 3.8 6.6 2.4 4.5 4.6 9.1 6.5 13.8 1.4 3.5 2.7 7.2 3.9 10.8 4.7 14.9 7 30.5 7 46.2 0 27.9-4.9 51.2-15 71.2-.6 1.2-1.2 2.4-1.8 3.5-1.8 3.3-3.8 6.5-5.9 9.6-.7 1-1.4 2-2 3-2.6 3.6-5.3 7.1-8.5 10.7-5.6 6.5-11.5 12.2-16.6 17.2-4.7 4.5-12.1 4.4-16.6-.2-4.5-4.7-4.4-12.1.2-16.6 5-4.9 10.2-9.9 15.2-15.7 2.6-3 4.9-6 7.1-9 .6-.8 1.1-1.6 1.7-2.4 1.7-2.5 3.3-5.2 4.7-7.8.5-.9 1-1.9 1.5-2.8 8.4-16.6 12.5-36.4 12.5-60.6 0-13.2-2-26.4-5.9-39.1-1-3.1-2.1-6.1-3.3-9.1-1.6-3.9-3.4-7.8-5.4-11.6-1-1.9-2.1-3.8-3.2-5.6-6.2-10.2-13.8-19.4-22.6-27.3-25.3-22.9-59.8-35.5-97-35.5S89.1 36.1 63.8 59c-26 23.5-40.3 56.4-40.3 92.5 0 56.9 22.7 79.1 42.8 98.6l2.8 2.7c13.4 13 26.1 25.2 29.3 49.9.9 6.4-3.7 12.4-10.1 13.2-.6.2-1.1.2-1.6.2z"></path><path class="lineal-fill" d="M141.9 397.8h38c3.8 0 7.4-1.5 10.1-4.2l13-13c2-2 3.4-4.6 3.9-7.4l12.4-63.7h-117l12.4 63.7c.6 2.8 2 5.4 4 7.4l13 13c2.7 2.7 6.3 4.2 10.2 4.2z"></path><path class="lineal-stroke" d="M179.8 409.6h-37.9c-6.9 0-13.6-2.7-18.5-7.7l-13-13c-3.7-3.7-6.2-8.4-7.2-13.5l-12.4-63.7c-1.2-6.4 2.9-12.5 9.3-13.8.7-.1 1.5-.2 2.2-.2h117c6.5 0 11.8 5.3 11.8 11.8 0 .8-.1 1.5-.2 2.2l-12.4 63.7c-1 5.1-3.5 9.8-7.2 13.5l-13 13c-4.8 4.9-11.5 7.7-18.5 7.7zm-63.2-88.4l9.7 49.7c.1.5.4 1 .7 1.4l13 13c.5.5 1.2.8 1.9.8h38c.7 0 1.4-.3 1.9-.8l13-13c.4-.4.6-.9.7-1.4l9.6-49.7h-88.5z"></path><path class="lineal-stroke" d="M241.5 321H80.2c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h161.4c6.5-.2 11.9 4.9 12.1 11.4.2 6.5-4.9 11.9-11.4 12.1h-.8zm-14.8 44.3H95c-6.5-.2-11.6-5.6-11.4-12.1.2-6.2 5.2-11.2 11.4-11.4h131.7c6.5.2 11.6 5.6 11.4 12.1-.2 6.2-5.2 11.2-11.4 11.4z"></path></svg>
                 <h4 class="!mb-1">1. Concept</h4>
                 <p>Nulla vitae elit libero elit non porta gravida eget metus cras.</p>
               </div>
@@ -731,15 +731,15 @@
             <div class="flex flex-wrap mx-[-15px] !mt-[-15px]">
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean quam ornare. Curabitur blandit.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Aenean quam ornare. Curabitur blandit.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Nullam quis risus eget urna mollis ornare.</span></li>
                 </ul>
               </div>
               <!--/column -->
               <div class="xl:w-6/12 w-full flex-[0_0_auto] !px-[15px] !mt-[15px] max-w-full">
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta euismod malesuada mollis.</span></li>
-                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Vivamus sagittis lacus vel augue rutrum.</span></li>
+                  <li class="relative !pl-6"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Etiam porta euismod malesuada mollis.</span></li>
+                  <li class="relative !pl-6 !mt-3"><span><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell absolute left-0"></i></span><span>Vivamus sagittis lacus vel augue rutrum.</span></li>
                 </ul>
               </div>
               <!--/column -->
@@ -770,7 +770,7 @@
     <section class="wrapper !bg-[#ffffff]">
       <div class="container py-[4.5rem] xl:!py-24 lg:!py-24 md:!py-24">
         <div class="pricing-wrapper !relative z-[3] !mt-[-15rem] xl:!mt-[-20rem] lg:!mt-[-20rem] md:!mt-[-20rem]">
-          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#3f78e0_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
+          <div class="shape bg-dot primary rellax !w-[6rem] !h-[8rem] bg-[radial-gradient(#e31e24_2px,transparent_2.5px)] absolute z-[1] opacity-50" data-rellax-speed="1" style="top: 2rem; right: -2.4rem;"></div>
           <div class="shape !rounded-[50%] bg-line red rellax !w-[8rem] !h-[8rem] hidden xl:block lg:block absolute z-[1] opacity-50" data-rellax-speed="1" style="bottom: 0.5rem; left: -2.5rem;"></div>
           <div class="flex flex-wrap items-center justify-center pricing-switcher-wrapper switcher">
             <p class="!mb-0 !pr-[.75rem]">Monthly</p>
@@ -785,7 +785,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 412.9" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/shopping-basket.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-fill" d="M453.8 238.1l-9.6 76.3H67.8l-9.6-76.3z"></path><circle class="lineal-fill" cx="178.1" cy="149.9" r="35.1"></circle><circle class="lineal-fill" cx="333.9" cy="149.9" r="35.1"></circle><path class="lineal-stroke" d="M498.6 136.5h-60.2c-7.4-.2-13.6 5.7-13.8 13.1-.2 7.4 5.7 13.6 13.1 13.8h11.8l-7.5 61.3H70.1l-7.5-61.3h68.9c7.4 25.7 34.3 40.6 60 33.1 16-4.6 28.5-17.1 33.1-33.1h62.6c7.4 25.7 34.3 40.6 60 33.2 25.7-7.4 40.6-34.3 33.2-60-4.9-17.1-18.9-30.1-36.3-33.9l-39-94.2c-2.8-6.9-10.7-10.1-17.6-7.3s-10.1 10.7-7.3 17.6l35.7 86.2c-14 5.5-24.6 17.2-28.8 31.6h-62.6c-4.2-14.4-14.8-26.1-28.8-31.7l35.7-86.2c2.8-6.9-.4-14.7-7.3-17.6s-14.7.4-17.6 7.3l-39.1 94.2c-17.4 3.8-31.3 16.9-36.2 33.9H13.4C6 136.7.1 142.9.3 150.3c.2 7.1 5.9 12.9 13.1 13.1h22.1l29.8 237.8c.9 6.7 6.6 11.8 13.3 11.8h354.8c6.8 0 12.5-5 13.3-11.8l29.8-237.8h22c7.4-.2 13.3-6.4 13.1-13.8-.2-7.2-5.9-12.9-13-13.1zm-165-8.2c.4 0 .9.1 1.3.1h.7c11.9.9 20.8 11.3 19.9 23.2-.9 11.9-11.3 20.8-23.2 19.9-11.9-.9-20.8-11.3-19.9-23.2.8-11.1 10-19.7 21.2-20zm-157.1.1h.7c.4 0 .9-.1 1.3-.1 11.9.2 21.4 10 21.3 22-.2 11.9-10 21.4-22 21.3-11.9-.2-21.4-10-21.3-22 .2-11.2 8.9-20.4 20-21.2zm-103 123.1h365.1l-6.3 49.5H79.7l-6.2-49.5zM90.4 386L83 327.9h345.9l-7.4 58.1H90.4z"></path></svg>
                   <h4 class="card-title">Basic Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">9</span> <span class="price-duration">mo</span></div>
@@ -793,13 +793,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
+                    <li class="relative !pl-6"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>1</strong> Project </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100MB</strong> Storage </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong> </span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -809,7 +809,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full popular !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
+                  <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 479.8 512" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/home.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M308 512H61.9c-8 0-14.4-6.5-14.4-14.4V227.2c0-4.3 2-8.4 5.4-11.2l178-143.7c5.3-4.3 12.8-4.3 18.1 0L427 216c3.4 2.7 5.4 6.9 5.4 11.2v269.6c-.2 8-6.8 14.3-14.8 14-7.7-.2-13.8-6.4-14-14V234.1L239.9 102 76.3 234.1v249.1H308c8 .2 14.3 6.8 14 14.8-.2 7.6-6.3 13.8-14 14z"></path><path class="lineal-stroke" d="M465.4 209.8c-3.3 0-6.4-1.1-9-3.2L239.9 32.9 23.5 206.7c-6.2 5-15.3 4-20.3-2.2s-4-15.3 2.2-20.3l225.5-181c5.3-4.2 12.8-4.2 18.1 0l225.5 181c6.2 5 7.2 14.1 2.2 20.3-2.8 3.3-6.9 5.3-11.3 5.3z"></path><ellipse transform="rotate(-80.781 239.904 207.686)" class="lineal-fill" cx="239.9" cy="207.7" rx="42.9" ry="43"></ellipse><path class="lineal-stroke" d="M239.9 265.1c-31.7 0-57.4-25.7-57.4-57.4s25.7-57.4 57.4-57.4 57.4 25.7 57.4 57.4c-.1 31.7-25.7 57.3-57.4 57.4zm0-85.9c-15.8 0-28.5 12.8-28.5 28.5s12.8 28.5 28.5 28.5 28.5-12.8 28.5-28.5c0-15.8-12.8-28.5-28.5-28.5z"></path><path class="lineal-fill" d="M171.8 325.7h136.1v171.9H171.8z"></path><path class="lineal-stroke" d="M308 512H171.8c-8 0-14.4-6.5-14.4-14.4V325.7c0-8 6.5-14.4 14.4-14.4H308c8 0 14.4 6.5 14.4 14.4v171.9c0 7.9-6.4 14.4-14.4 14.4zm-121.8-28.9h107.3v-143H186.2v143zm234.2-317.7c-7.9 0-14.4-6.5-14.4-14.4V73.3h-28.6c-8 0-14.4-6.5-14.4-14.4s6.5-14.4 14.4-14.4h43c8 0 14.4 6.5 14.4 14.4v92c0 8-6.4 14.4-14.4 14.5 0-.1 0 0 0 0z"></path></svg>
                   <h4 class="card-title">Premium Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">19</span> <span class="price-duration">mo</span></div>
@@ -817,13 +817,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>5</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>100K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>200MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
                     <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-times bullet-soft-red absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center !bg-[#fae3e4] !text-[#e2626b] rounded-[100%] top-[0.2rem] before:content-['\ed3b'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -833,7 +833,7 @@
             <div class="md:w-6/12 lg:w-4/12 xl:w-4/12 md:!ml-[25%] w-full flex-[0_0_auto] !px-[15px] max-w-full xl:!ml-0 lg:!ml-0 !mt-[30px]">
               <div class="pricing card !text-center">
                 <div class="card-body flex-[1_1_auto]  pb-4 xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem]">
-                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#3f78e0] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
+                 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 409.6 380.8" data-inject-url="https://Trunçgil-tailwind-template.netlify.app/assets/img/icons/lineal/briefcase-2.svg" class="svg-inject icon-svg text-[#e31e24] !mb-3 !w-[2.6rem] !h-[2.6rem] m-[0_auto]"><path class="lineal-stroke" d="M299.9 104.7h-23.8V56.5c0-18.1-14.6-32.7-32.7-32.7h-77.2c-18 0-32.7 14.7-32.7 32.7v48.2h-23.8V56.5C109.8 25.3 135 0 166.2 0h77.2c31.2 0 56.4 25.3 56.5 56.5v48.2z"></path><path class="lineal-stroke" d="M360.5 380.8H49.1c-27.1 0-49-22-49.1-49.1V119.1C0 92 22 70 49.1 70h311.5c27.1 0 49 22 49.1 49.1v212.7c-.1 27.1-22.1 49-49.2 49zM49.1 93.8c-14 0-25.3 11.3-25.3 25.3v212.7c0 14 11.3 25.3 25.3 25.3h311.5c14 0 25.3-11.3 25.3-25.3V119.1c0-14-11.3-25.3-25.3-25.3H49.1z"></path><path class="lineal-fill" d="M49.2 81.7c-18.4 0-33.3 14.8-33.3 33.2 0 2.7.3 5.3.9 7.9C35.4 197.9 103.6 254 184.2 254h41.2c80.6 0 148.8-56.1 167.3-131.2 4.3-17.8-6.6-35.8-24.5-40.2-2.6-.6-5.2-.9-7.9-.9H49.2z"></path><path class="lineal-stroke" d="M225.4 265.9h-41.2c-41.5-.1-81.8-14.2-114.3-40C38 200.5 15.3 165.2 5.4 125.6-.5 101.4 14.3 77 38.6 71.1c3.5-.9 7.1-1.3 10.7-1.3h311.1c24.9 0 45.2 20.2 45.2 45.1 0 3.6-.4 7.2-1.3 10.7-9.9 39.6-32.6 74.8-64.5 100.2-32.6 25.9-72.9 40-114.4 40.1zM49.2 93.6c-6.6 0-12.9 3-16.9 8.2-4.1 5.1-5.5 11.8-3.9 18.2 17.6 71.8 81.9 122.3 155.8 122.2h41.2c73.9.1 138.3-50.4 155.8-122.2 1.6-6.3.1-13-3.9-18.1-4.1-5.2-10.3-8.3-16.9-8.2l-311.2-.1z"></path><path class="lineal-fill" d="M128.5 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M128.5 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path><path class="lineal-fill" d="M294.9 288.5h-13.8c-8.9 0-16.1-7.2-16.1-16.1v-48.3c0-8.9 7.2-16.1 16.1-16.1h13.8c8.9 0 16.1 7.2 16.1 16.1v48.3c0 8.9-7.2 16.1-16.1 16.1z"></path><path class="lineal-stroke" d="M294.9 300.4h-13.8c-15.5 0-28-12.5-28-28v-48.3c0-15.5 12.5-28 28-28h13.8c15.5 0 28 12.5 28 28v48.3c0 15.5-12.5 28-28 28zm-13.8-80.5c-2.3 0-4.2 1.9-4.2 4.2v48.3c0 2.3 1.9 4.2 4.2 4.2h13.8c2.3 0 4.2-1.9 4.2-4.2v-48.3c0-2.3-1.9-4.2-4.2-4.2h-13.8z"></path></svg>
                   <h4 class="card-title">Corporate Plan</h4>
                   <div class="prices !text-[#343f52]">
                     <div class="price price-show"><span class="price-currency">$</span><span class="price-value">49</span> <span class="price-duration">mo</span></div>
@@ -841,13 +841,13 @@
                   </div>
                   <!--/.prices -->
                   <ul class="pl-0 list-none bullet-bg bullet-soft-primary !mt-7 !mb-8 text-left">
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
-                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>20</strong> Projects </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>300K</strong> API Access </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span><strong>500MB</strong> Storage </span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> Weekly <strong>Reports</strong></span></li>
+                    <li class="relative !pl-6 !mt-[0.35rem]"><i class="uil uil-check absolute left-0 w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex items-center justify-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i><span> 7/24 <strong>Support</strong></span></li>
                   </ul>
-                  <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
+                  <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Choose Plan</a>
                 </div>
                 <!--/.card-body -->
               </div>
@@ -876,17 +876,17 @@
           <div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">7518</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">7518</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Completed Projects</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">5472</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">5472</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Satisfied Customers</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]">2184</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]">2184</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">Expert Employees</p>
               </div>
               <!--/column -->
@@ -925,7 +925,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -934,11 +934,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -956,7 +956,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -979,9 +979,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/shop-cart.html b/public/html/shop-cart.html
index 549c663..ede6968 100644
--- a/public/html/shop-cart.html
+++ b/public/html/shop-cart.html
@@ -537,7 +537,7 @@
               <li class="nav-item !ml-[.8rem]">
                 <a class="nav-link !relative !flex !flex-row !items-center" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-cart">
                   <i class="uil uil-shopping-cart !text-[1.1rem] before:content-['\ecbd']"></i>
-                  <span class="badge badge-cart bg-[#3f78e0] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
+                  <span class="badge badge-cart bg-[#e31e24] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
                 </a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
@@ -563,7 +563,7 @@
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -577,14 +577,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -598,14 +598,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -619,7 +619,7 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
           </div>
@@ -629,7 +629,7 @@
               <span>Subtotal:</span>
               <span class="h6 !mb-0">$135.99</span>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
             <p class="!text-[.7rem] !mb-0">Free shipping on all orders over $50</p>
           </div>
           <!-- /.offcanvas-footer-->
@@ -654,8 +654,8 @@
       <div class="container py-3 xl:!py-5 lg:!py-5 md:!py-5">
         <nav class="inline-block" aria-label="breadcrumb">
           <ol class="breadcrumb  flex flex-wrap bg-[none] p-0 !rounded-none list-none !mb-0">
-            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
-            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Shop</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Shop</a></li>
             <li class="breadcrumb-item flex !text-[#aab0bc] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Cart</li>
           </ol>
         </nav>
@@ -692,7 +692,7 @@
                     <td class="option text-left flex flex-row items-center !pl-0">
                       <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                       <div class="w-full !ml-4">
-                        <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                        <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                         <div class="small">Color: Black</div>
                         <div class="small">Size: 43</div>
                       </div>
@@ -716,14 +716,14 @@
                       <p class="price !m-0"><span class="amount">$45.99</span></p>
                     </td>
                     <td class="!pr-0">
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
                     </td>
                   </tr>
                   <tr>
                     <td class="option text-left flex flex-row items-center !pl-0">
                       <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                       <div class="w-full !ml-4">
-                        <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                        <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                         <div class="small">Color: Misc</div>
                         <div class="small">Size: 43</div>
                       </div>
@@ -747,14 +747,14 @@
                       <p class="price !m-0"><span class="amount">$45.00</span></p>
                     </td>
                     <td class="!pr-0">
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
                     </td>
                   </tr>
                   <tr>
                     <td class="option text-left flex flex-row items-center !pl-0">
                       <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                       <div class="w-full !ml-4">
-                        <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                        <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                         <div class="small">Color: Black</div>
                       </div>
                     </td>
@@ -777,7 +777,7 @@
                       <p class="price !m-0"><span class="amount">$45.00</span></p>
                     </td>
                     <td class="!pr-0">
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a>
                     </td>
                   </tr>
                 </tbody>
@@ -790,13 +790,13 @@
                   <input type="url" class="form-control relative block w-full text-[.75rem] font-medium !text-[#60697b] bg-[#fefefe] bg-clip-padding border shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] rounded-[0.4rem] border-solid border-[rgba(8,60,130,0.07)] transition-[border-color] duration-[0.15s] ease-in-out focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] focus-visible:!border-[rgba(63,120,224,0.5)] placeholder:!text-[#959ca9] placeholder:opacity-100 m-0 !pr-9 p-[.6rem_1rem] h-[calc(2.5rem_+_2px)] min-h-[calc(2.5rem_+_2px)] !leading-[1.25]" placeholder="" id="seo-check">
                   <label for="seo-check" class="inline-block !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope
                   ">Enter promo code</label>
-                  <button class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button">Apply</button>
+                  <button class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" type="button">Apply</button>
                 </div>
                 <!-- /.input-group -->
               </div>
               <!-- /column -->
               <div class="md:w-4/12 lg:w-5/12 xl:w-5/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !ml-auto lg:!ml-0 xl:!ml-0 xl:!text-right lg:!text-right md:!text-right !mt-[20px]">
-                <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Update Cart</a>
+                <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Update Cart</a>
               </div>
               <!-- /column -->
             </div>
@@ -835,7 +835,7 @@
                 </tbody>
               </table>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded w-full !mt-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Proceed to Checkout</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded w-full !mt-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Proceed to Checkout</a>
           </div>
           <!-- /column -->
         </div>
@@ -914,7 +914,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -923,11 +923,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -945,7 +945,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -968,9 +968,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/shop-checkout.html b/public/html/shop-checkout.html
index b3d0aab..6e76f9a 100644
--- a/public/html/shop-checkout.html
+++ b/public/html/shop-checkout.html
@@ -537,7 +537,7 @@
               <li class="nav-item !ml-[.8rem]">
                 <a class="nav-link !relative !flex !flex-row !items-center" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-cart">
                   <i class="uil uil-shopping-cart !text-[1.1rem] before:content-['\ecbd']"></i>
-                  <span class="badge badge-cart bg-[#3f78e0] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
+                  <span class="badge badge-cart bg-[#e31e24] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
                 </a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
@@ -563,7 +563,7 @@
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -577,14 +577,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -598,14 +598,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -619,7 +619,7 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
           </div>
@@ -629,7 +629,7 @@
               <span>Subtotal:</span>
               <span class="h6 !mb-0">$135.99</span>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
             <p class="!text-[.7rem] !mb-0">Free shipping on all orders over $50</p>
           </div>
           <!-- /.offcanvas-footer-->
@@ -654,9 +654,9 @@
       <div class="container py-3 xl:!py-5 lg:!py-5 md:!py-5">
         <nav class="inline-block" aria-label="breadcrumb">
           <ol class="breadcrumb  flex flex-wrap bg-[none] p-0 !rounded-none list-none !mb-0">
-            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
-            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Shop</a></li>
-            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Cart</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Shop</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Cart</a></li>
             <li class="breadcrumb-item flex !text-[#aab0bc] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Checkout</li>
           </ol>
         </nav>
@@ -804,7 +804,7 @@
                 <div class="flex flex-row flex items-center">
                   <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                   <div class="w-full !ml-4">
-                    <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                    <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                     <div class="small">Color: Black</div>
                     <div class="small">Size: 43</div>
                   </div>
@@ -818,7 +818,7 @@
                 <div class="flex flex-row flex items-center">
                   <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                   <div class="w-full !ml-4">
-                    <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                    <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                     <div class="small">Color: Misc</div>
                     <div class="small">Size: 43</div>
                   </div>
@@ -832,7 +832,7 @@
                 <div class="flex flex-row flex items-center">
                   <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                   <div class="w-full !ml-4">
-                    <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                    <h3 class="post-title h6 !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                     <div class="small">Color: Black</div>
                   </div>
                 </div>
@@ -887,7 +887,7 @@
                 </tbody>
               </table>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded w-full !mt-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Place Order</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded w-full !mt-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Place Order</a>
           </div>
           <!-- /column -->
         </div>
@@ -913,7 +913,7 @@
                 <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                 <label for="loginPassword1" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
               </div>
-              <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+              <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
             </form>
             <!-- /form -->
             <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -959,7 +959,7 @@
                 <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                 <label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
               </div>
-              <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+              <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
             </form>
             <!-- /form -->
             <p class="!mb-0">Already have an account? <a href="#" data-bs-target="#modal-signin" data-bs-toggle="modal" data-bs-dismiss="modal" class="hover">Sign in</a></p>
@@ -1048,7 +1048,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1057,11 +1057,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1079,7 +1079,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca] bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]" placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1102,9 +1102,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/shop-product.html b/public/html/shop-product.html
index 763828f..a6d0a85 100644
--- a/public/html/shop-product.html
+++ b/public/html/shop-product.html
@@ -543,7 +543,7 @@
               <li class="nav-item !ml-[.8rem]">
                 <a class="nav-link !relative !flex !flex-row !items-center" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-cart">
                   <i class="uil uil-shopping-cart !text-[1.1rem] before:content-['\ecbd']"></i>
-                  <span class="badge badge-cart bg-[#3f78e0] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
+                  <span class="badge badge-cart bg-[#e31e24] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
                 </a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
@@ -569,7 +569,7 @@
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -583,14 +583,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -604,14 +604,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -625,7 +625,7 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
           </div>
@@ -635,7 +635,7 @@
               <span>Subtotal:</span>
               <span class="h6 !mb-0">$135.99</span>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
             <p class="!text-[.7rem] !mb-0">Free shipping on all orders over $50</p>
           </div>
           <!-- /.offcanvas-footer-->
@@ -660,9 +660,9 @@
       <div class="container py-3 xl:!py-5 lg:!py-5 md:!py-5">
         <nav class="inline-block" aria-label="breadcrumb">
           <ol class="breadcrumb  flex flex-wrap bg-[none] p-0 !rounded-none list-none !mb-0">
-            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
-            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Shop</a></li>
-            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Cosmetics</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Shop</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Cosmetics</a></li>
             <li class="breadcrumb-item flex !text-[#aab0bc] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Cleansers</li>
           </ol>
         </nav>
@@ -714,7 +714,7 @@
           <!-- /column -->
           <div class="xl:w-6/12 lg:w-6/12 w-full flex-[0_0_auto] !px-[15px] xl:!px-[35px] lg:!px-[20px] !mt-[40px] max-w-full">
             <div class="post-header !mb-5">
-              <h2 class="post-title !text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Curology Skincare Set</a></h2>
+              <h2 class="post-title !text-[calc(1.285rem_+_0.42vw)] font-bold xl:!text-[1.6rem] !leading-[1.3]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Curology Skincare Set</a></h2>
               <p class="price text-[1rem] !mb-2"><span class="amount">$55.00</span></p>
               <a href="#" class="!text-[#60697b] ratings-wrapper"><span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 four align-[-1px]"></span><span class="inline-block">(3 Reviews)</span></a>
             </div>
@@ -758,7 +758,7 @@
                   <input type="radio" name="colors" id="color-3">
                   <span class=" absolute inset-0 h-full w-full text-[1px] flex items-center justify-center place-items-center text-transparent rounded-[100%] bg-[var(--color,rgba(164,174,198,.2))]">Green</span>
                 </label>
-                <label class=" relative isolate flex items-center place-items-center cursor-pointer !mr-2 w-6 h-6" for="color-4" style="--color:#3f78e0">
+                <label class=" relative isolate flex items-center place-items-center cursor-pointer !mr-2 w-6 h-6" for="color-4" style="--color:#e31e24">
                   <input type="radio" name="colors" id="color-4">
                   <span class=" absolute inset-0 h-full w-full text-[1px] flex items-center justify-center place-items-center text-transparent rounded-[100%] bg-[var(--color,rgba(164,174,198,.2))]">Blue</span>
                 </label>
@@ -782,7 +782,7 @@
                     <!--/.form-select-wrapper -->
                   </div>
                   <div class="grow mx-2">
-                    <button class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full grow hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-shopping-bag !font-normal !mt-[-0.05rem] !mr-1 before:content-['\ecba']"></i> Add to Cart</button>
+                    <button class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !w-full grow hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-shopping-bag !font-normal !mt-[-0.05rem] !mr-1 before:content-['\ecba']"></i> Add to Cart</button>
                   </div>
                   <div>
                     <button class="btn btn-block btn-red !text-white !bg-[#e2626b] border-[#e2626b] hover:text-white hover:bg-[#e2626b] hover:!border-[#e2626b]   active:text-white active:bg-[#e2626b] active:border-[#e2626b] disabled:text-white disabled:bg-[#e2626b] disabled:border-[#e2626b] btn-icon rounded !px-3 !w-full !h-full hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-heart before:content-['\eb66']"></i></button>
@@ -909,7 +909,7 @@
             <div class="widget !mt-10">
               <h4 class="widget-title !mb-3">Review this product</h4>
               <p class="!mb-5">Aenean eu leo quam ornare sem lacinia quam.</p>
-              <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] rounded w-full hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Write a Review</a>
+              <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] rounded w-full hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">Write a Review</a>
             </div>
             <!-- /.widget -->
           </aside>
@@ -941,7 +941,7 @@
                   <div class="comment-header !mb-2 xl:!flex lg:!flex md:!flex items-center">
                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u1.jpg"></figure>
                     <div>
-                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Connor Gibson</a></h6>
+                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Connor Gibson</a></h6>
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                         <li class="inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>14 Jan 2022</li>
                       </ul>
@@ -958,8 +958,8 @@
                   <div class="flex flex-row items-center pb-3">
                     <p class="!text-[#aab0bc] !text-[.75rem]  !mb-0 !mr-5">Was this review helpful?</p>
                     <div>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
                     </div>
                   </div>
                 </li>
@@ -967,7 +967,7 @@
                   <div class="comment-header !mb-2 xl:!flex lg:!flex md:!flex items-center">
                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                     <div>
-                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                         <li class="inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>21 Feb 2022</li>
                       </ul>
@@ -984,8 +984,8 @@
                   <div class="flex flex-row items-center pb-3">
                     <p class="!text-[#aab0bc] !text-[.75rem]  !mb-0 !mr-5">Was this review helpful?</p>
                     <div>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
                     </div>
                   </div>
                 </li>
@@ -993,7 +993,7 @@
                   <div class="flex items-center">
                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u3.jpg"></figure>
                     <div>
-                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Pearce Frye</a></h6>
+                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Pearce Frye</a></h6>
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                         <li class="inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>22 Feb 2022</li>
                       </ul>
@@ -1010,8 +1010,8 @@
                   <div class="flex flex-row items-center pb-3">
                     <p class="!text-[#aab0bc] !text-[.75rem]  !mb-0 !mr-5">Was this review helpful?</p>
                     <div>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
                     </div>
                   </div>
                 </li>
@@ -1019,7 +1019,7 @@
                   <div class="flex items-center">
                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u2.jpg"></figure>
                     <div>
-                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Nikolas Brooten</a></h6>
+                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Nikolas Brooten</a></h6>
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                         <li class="inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>4 Apr 2022</li>
                       </ul>
@@ -1036,8 +1036,8 @@
                   <div class="flex flex-row items-center pb-3">
                     <p class="!text-[#aab0bc] !text-[.75rem]  !mb-0 !mr-5">Was this review helpful?</p>
                     <div class="flex flex-row items-end">
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
                     </div>
                   </div>
                 </li>
@@ -1045,7 +1045,7 @@
                   <div class="comment-header !mb-2 xl:!flex lg:!flex md:!flex items-center">
                     <figure class="w-12 h-12 !relative !mr-4 rounded-[100%]"><img class="rounded-[50%]" alt="image" src="../assets/img/avatars/u4.jpg"></figure>
                     <div>
-                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">Lou Bloxham</a></h6>
+                      <h6 class=" m-0 !mb-[0.2rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">Lou Bloxham</a></h6>
                       <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                         <li class="inline-block"><i class="uil uil-calendar-alt pr-[0.2rem] align-[-.05rem] before:content-['\e9ba']"></i>3 May 2022</li>
                       </ul>
@@ -1061,8 +1061,8 @@
                   <div class="flex flex-row items-center pb-3">
                     <p class="!text-[#aab0bc] !text-[.75rem]  !mb-0 !mr-5">Was this review helpful?</p>
                     <div>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
-                      <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24] !mr-3"><i class="uil uil-thumbs-up before:content-['\ed35'] "></i> 5</a>
+                      <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-thumbs-down before:content-['\ed36'] "></i> 5</a>
                     </div>
                   </div>
                 </li>
@@ -1166,7 +1166,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1175,11 +1175,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1197,7 +1197,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1220,9 +1220,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/shop.html b/public/html/shop.html
index 87dfde6..40d96b5 100644
--- a/public/html/shop.html
+++ b/public/html/shop.html
@@ -543,7 +543,7 @@
               <li class="nav-item !ml-[.8rem]">
                 <a class="nav-link !relative !flex !flex-row !items-center" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-cart">
                   <i class="uil uil-shopping-cart !text-[1.1rem] before:content-['\ecbd']"></i>
-                  <span class="badge badge-cart bg-[#3f78e0] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
+                  <span class="badge badge-cart bg-[#e31e24] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
                 </a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
@@ -569,7 +569,7 @@
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -583,14 +583,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -604,14 +604,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -625,7 +625,7 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
           </div>
@@ -635,7 +635,7 @@
               <span>Subtotal:</span>
               <span class="h6 !mb-0">$135.99</span>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
             <p class="!text-[.7rem] !mb-0">Free shipping on all orders over $50</p>
           </div>
           <!-- /.offcanvas-footer-->
@@ -677,7 +677,7 @@
             <h2 class="!text-[calc(1.265rem_+_0.18vw)] font-bold xl:!text-[1.4rem] !leading-[1.35]">New Arrivals</h2>
             <nav class="inline-block" aria-label="breadcrumb">
               <ol class="breadcrumb !mb-0 flex flex-wrap p-0 !rounded-none">
-                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
                 <li class="breadcrumb-item flex !text-[#60697b] !pl-[.5rem] active before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Shop</li>
               </ol>
             </nav>
@@ -714,7 +714,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Shoes</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h2>
                 <p class="price !m-0"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.00</span></ins></p>
               </div>
               <!-- /.post-header -->
@@ -732,7 +732,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 four"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Apple Watch</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Apple Watch</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -750,7 +750,7 @@
                 <div class="flex flex-row items-center justify-between !mb-2">
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Headphones</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Headphones</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -768,7 +768,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Shoes</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 three"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -786,7 +786,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 one"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -804,7 +804,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Cosmetics</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 two"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Curology Cleanser</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Curology Cleanser</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -822,7 +822,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Home & Kitchen</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 four"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Q&Q Wall Clock</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Q&Q Wall Clock</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -839,7 +839,7 @@
                 <div class="flex flex-row items-center justify-between !mb-2">
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Earphones</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Earphones</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -857,7 +857,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Accessories</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Apple Watch Milano Loop</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Apple Watch Milano Loop</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -960,7 +960,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -969,11 +969,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -991,7 +991,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1014,9 +1014,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/shop2.html b/public/html/shop2.html
index 4574b57..e568ee0 100644
--- a/public/html/shop2.html
+++ b/public/html/shop2.html
@@ -543,7 +543,7 @@
               <li class="nav-item !ml-[.8rem]">
                 <a class="nav-link !relative !flex !flex-row !items-center" data-bs-toggle="offcanvas" data-bs-target="#offcanvas-cart">
                   <i class="uil uil-shopping-cart !text-[1.1rem] before:content-['\ecbd']"></i>
-                  <span class="badge badge-cart bg-[#3f78e0] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
+                  <span class="badge badge-cart bg-[#e31e24] w-[0.9rem] h-[0.9rem] !flex items-center justify-center !text-[0.55rem] p-0 rounded-[100%] !bg-[rgba(63,120,224)] opacity-100">3</span>
                 </a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
@@ -569,7 +569,7 @@
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth1.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.99</span></ins></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -583,14 +583,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth2.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -604,14 +604,14 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
             <div class="shopping-cart-item flex justify-between !mb-4">
               <div class="flex flex-row">
                 <figure class="!rounded-[.4rem] !w-[7rem]"><a href='shop-product.html'><img class="!rounded-[.4rem]" src="../assets/img/photos/sth3.jpg" alt="image"></a></figure>
                 <div class="!w-full !ml-[1rem]">
-                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h3>
+                  <h3 class="post-title !text-[.8rem] !leading-[1.35] !mb-1"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h3>
                   <p class="price !text-[.7rem]"><span class="amount">$45.00</span></p>
                   <div class="form-select-wrapper">
                     <select class="form-select !w-auto !min-w-[2.5rem] !bg-[right_0.4rem_center] !px-2 !py-[0.2rem] !text-[.7rem] !rounded-[.4rem]">
@@ -625,7 +625,7 @@
                   <!--/.form-select-wrapper -->
                 </div>
               </div>
-              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
+              <div class="!ml-[.5rem]"><a href="#" class="!text-[#343f52] hover:!text-[#e31e24]"><i class="uil uil-trash-alt before:content-['\ed4b']"></i></a></div>
             </div>
             <!--/.shopping-cart-item -->
           </div>
@@ -635,7 +635,7 @@
               <span>Subtotal:</span>
               <span class="h6 !mb-0">$135.99</span>
             </div>
-            <a href="#" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
+            <a href="#" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] btn-icon btn-icon-start rounded !w-full !mb-4 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]"><i class="uil uil-credit-card !text-[.9rem] !mr-[0.3rem] before:content-['\ea74']"></i> Checkout</a>
             <p class="!text-[.7rem] !mb-0">Free shipping on all orders over $50</p>
           </div>
           <!-- /.offcanvas-footer-->
@@ -660,7 +660,7 @@
       <div class="container py-3 xl:!py-5 lg:!py-5 md:!py-5">
         <nav class="inline-block" aria-label="breadcrumb">
           <ol class="breadcrumb  flex flex-wrap bg-[none] p-0 !rounded-none list-none !mb-0">
-            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+            <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
             <li class="breadcrumb-item flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons active" aria-current="page">Shop</li>
           </ol>
         </nav>
@@ -709,7 +709,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Shoes</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Nike Air Sneakers</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Nike Air Sneakers</a></h2>
                 <p class="price !m-0"><del class="!text-[#9499a3]"><span class="amount">$55.00</span></del> <ins class="no-underline !text-[#e2626b]"><span class="amount">$45.00</span></ins></p>
               </div>
               <!-- /.post-header -->
@@ -727,7 +727,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 four"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Apple Watch</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Apple Watch</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -745,7 +745,7 @@
                 <div class="flex flex-row items-center justify-between !mb-2">
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Headphones</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Headphones</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -763,7 +763,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Shoes</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 three"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Colorful Sneakers</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Colorful Sneakers</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -781,7 +781,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 one"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Polaroid Camera</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Polaroid Camera</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -799,7 +799,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Cosmetics</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 two"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Curology Cleanser</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Curology Cleanser</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -817,7 +817,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Home & Kitchen</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 four"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Q&Q Wall Clock</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Q&Q Wall Clock</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -834,7 +834,7 @@
                 <div class="flex flex-row items-center justify-between !mb-2">
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Electronics</div>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Earphones</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Earphones</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -852,7 +852,7 @@
                   <div class="uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#9499a3] !mb-0">Accessories</div>
                   <span class="ratings  inline-block relative w-20 h-[0.8rem] text-[0.9rem] leading-none before:text-[rgba(38,43,50,0.1)] after:inline-block after:not-italic after:font-normal after:absolute after:!text-[#fcc032] after:content-['\2605\2605\2605\2605\2605'] after:overflow-hidden after:left-0 after:top-0 before:inline-block before:not-italic before:font-normal before:absolute before:!text-[#fcc032] before:content-['\2605\2605\2605\2605\2605'] before:overflow-hidden before:left-0 before:top-0 five"></span>
                 </div>
-                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#3f78e0]' href='shop-product.html'>Apple Watch Milano Loop</a></h2>
+                <h2 class="post-title h3 text-[1.1rem]"><a class='!text-[#343f52] hover:!text-[#e31e24]' href='shop-product.html'>Apple Watch Milano Loop</a></h2>
                 <p class="price !m-0"><span class="amount">$55.00</span></p>
               </div>
               <!-- /.post-header -->
@@ -1112,7 +1112,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -1121,11 +1121,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -1143,7 +1143,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -1166,9 +1166,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/signin.html b/public/html/signin.html
index 8d6e7f6..7e9dbe2 100644
--- a/public/html/signin.html
+++ b/public/html/signin.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
             <h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Sign In</h1>
             <nav class="inline-block" aria-label="breadcrumb">
               <ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
-                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
                 <li class="breadcrumb-item active flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Sign In</li>
               </ol>
             </nav>
@@ -595,7 +595,7 @@
                     <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                     <label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
                   </div>
-                  <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                  <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                 </form>
                 <!-- /form -->
                 <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -644,7 +644,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -653,11 +653,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -675,7 +675,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -698,9 +698,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/signin2.html b/public/html/signin2.html
index 82ab5e3..7bb4c06 100644
--- a/public/html/signin2.html
+++ b/public/html/signin2.html
@@ -537,9 +537,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
@@ -601,7 +601,7 @@
                         <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                         <label for="loginPassword" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Password</label>
                       </div>
-                      <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
+                      <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign In</a>
                     </form>
                     <!-- /form -->
                     <p class="!mb-1"><a href="#" class="hover">Forgot Password?</a></p>
@@ -654,7 +654,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -663,11 +663,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -685,7 +685,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -708,9 +708,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/signup.html b/public/html/signup.html
index 8dc5bfb..43f4592 100644
--- a/public/html/signup.html
+++ b/public/html/signup.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
             <h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Sign Up</h1>
             <nav class="inline-block" aria-label="breadcrumb">
               <ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
-                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
                 <li class="breadcrumb-item active flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,0.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Sign Up</li>
               </ol>
             </nav>
@@ -604,7 +604,7 @@
                     <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                     <label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
                   </div>
-                  <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                  <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                 </form>
                 <!-- /form -->
                 <p class="!mb-0">Already have an account? <a class='hover' href='signin.html'>Sign in</a></p>
@@ -652,7 +652,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -661,11 +661,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -683,7 +683,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -706,9 +706,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/signup2.html b/public/html/signup2.html
index 1856f2f..0cc8942 100644
--- a/public/html/signup2.html
+++ b/public/html/signup2.html
@@ -537,9 +537,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
@@ -610,7 +610,7 @@
                         <span class="password-toggle absolute -translate-y-2/4 cursor-pointer text-[0.9rem] !text-[#959ca9] right-3 top-2/4"><i class="uil uil-eye"></i></span>
                         <label for="loginPasswordConfirm" class="!text-[#959ca9] !mb-2 !inline-block text-[.75rem] !absolute !z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none border origin-[0_0] px-4 py-[0.6rem] border-solid border-transparent left-0 top-0 font-Manrope">Confirm Password</label>
                       </div>
-                      <a class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
+                      <a class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-login w-full !mb-2">Sign Up</a>
                     </form>
                     <!-- /form -->
                     <p class="!mb-0">Already have an account? <a class='hover' href='signin2.html'>Sign in</a></p>
@@ -662,7 +662,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -671,11 +671,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -693,7 +693,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -716,9 +716,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/single-project.html b/public/html/single-project.html
index 0eb6ebe..7803541 100644
--- a/public/html/single-project.html
+++ b/public/html/single-project.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -562,7 +562,7 @@
         <div class="flex flex-wrap mx-[-15px]">
           <div class="md:w-10/12 lg:w-8/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="post-header">
-              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                 <a href="#" class="hover" rel="category">Identity</a>
               </div>
               <!-- /.post-category -->
@@ -704,7 +704,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -713,11 +713,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -735,7 +735,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -758,9 +758,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/single-project2.html b/public/html/single-project2.html
index f133836..08ab02c 100644
--- a/public/html/single-project2.html
+++ b/public/html/single-project2.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -562,7 +562,7 @@
         <div class="flex flex-wrap mx-[-15px]">
           <div class="md:w-10/12 lg:w-8/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="post-header">
-              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+              <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                 <a href="#" class="hover" rel="category">Identity</a>
               </div>
               <!-- /.post-category -->
@@ -714,7 +714,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -723,11 +723,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -745,7 +745,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -768,9 +768,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/single-project3.html b/public/html/single-project3.html
index 9c4c435..f47e5d8 100644
--- a/public/html/single-project3.html
+++ b/public/html/single-project3.html
@@ -537,9 +537,9 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle hover:!text-[#ffffffb3]" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
@@ -707,7 +707,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -716,11 +716,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -738,7 +738,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -761,9 +761,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/single-project4.html b/public/html/single-project4.html
index cdbffd6..4b994a1 100644
--- a/public/html/single-project4.html
+++ b/public/html/single-project4.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -717,7 +717,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:#">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -726,11 +726,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -748,7 +748,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -771,9 +771,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"/>
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/public/html/style.css b/public/html/style.css
index ee68620..7110c5f 100644
--- a/public/html/style.css
+++ b/public/html/style.css
@@ -3322,8 +3322,8 @@
   .border-\[\#343f52\] {
     border-color: #343f52;
   }
-  .border-\[\#3f78e0\] {
-    border-color: #3f78e0;
+  .border-\[\#e31e24\] {
+    border-color: #e31e24;
   }
   .border-\[\#7cb798\] {
     border-color: #7cb798;
@@ -3430,8 +3430,8 @@
   .border-b-\[rgba\(164\,174\,198\,0\.2\)\] {
     border-bottom-color: rgba(164,174,198,0.2);
   }
-  .border-l-\[\#3f78e0\] {
-    border-left-color: #3f78e0;
+  .border-l-\[\#e31e24\] {
+    border-left-color: #e31e24;
   }
   .\!bg-\[\#5daed5\] {
     background-color: #5daed5 !important;
@@ -3442,8 +3442,8 @@
   .\!bg-\[\#343f52\] {
     background-color: #343f52 !important;
   }
-  .\!bg-\[\#3f78e0\] {
-    background-color: #3f78e0 !important;
+  .\!bg-\[\#e31e24\] {
+    background-color: #e31e24 !important;
   }
   .\!bg-\[\#7cb798\] {
     background-color: #7cb798 !important;
@@ -3703,8 +3703,8 @@
   .bg-\[\#343f52\] {
     background-color: #343f52;
   }
-  .bg-\[\#3f78e0\] {
-    background-color: #3f78e0;
+  .bg-\[\#e31e24\] {
+    background-color: #e31e24;
   }
   .bg-\[\#e31e24\] {
     background-color: #e31e24;
@@ -3973,8 +3973,8 @@
     --tw-gradient-position: in oklab;
     background-image: radial-gradient(var(--tw-gradient-stops));
   }
-  .\!bg-\[radial-gradient\(\#3f78e0_2px\,transparent_2\.5px\)\] {
-    background-image: radial-gradient(#3f78e0 2px,transparent 2.5px) !important;
+  .\!bg-\[radial-gradient\(\#e31e24_2px\,transparent_2\.5px\)\] {
+    background-image: radial-gradient(#e31e24 2px,transparent 2.5px) !important;
   }
   .\!bg-\[radial-gradient\(\#54a8c7_2px\,transparent_2\.5px\)\] {
     background-image: radial-gradient(#54a8c7 2px,transparent 2.5px) !important;
@@ -3982,8 +3982,8 @@
   .\!bg-\[radial-gradient\(\#747ed1_2px\,transparent_2\.5px\)\] {
     background-image: radial-gradient(#747ed1 2px,transparent 2.5px) !important;
   }
-  .bg-\[radial-gradient\(\#3f78e0_2px\,transparent_2\.5px\)\] {
-    background-image: radial-gradient(#3f78e0 2px,transparent 2.5px);
+  .bg-\[radial-gradient\(\#e31e24_2px\,transparent_2\.5px\)\] {
+    background-image: radial-gradient(#e31e24 2px,transparent 2.5px);
   }
   .bg-\[radial-gradient\(\#45c4a0_2px\,transparent_2\.5px\)\] {
     background-image: radial-gradient(#45c4a0 2px,transparent 2.5px);
@@ -4130,8 +4130,8 @@
   .stroke-\[\#343f52\] {
     stroke: #343f52;
   }
-  .stroke-\[\#3f78e0\] {
-    stroke: #3f78e0;
+  .stroke-\[\#e31e24\] {
+    stroke: #e31e24;
   }
   .stroke-\[\#54a8c7\] {
     stroke: #54a8c7;
@@ -5743,8 +5743,8 @@
   .\!text-\[\#3b768b\] {
     color: #3b768b !important;
   }
-  .\!text-\[\#3f78e0\] {
-    color: #3f78e0 !important;
+  .\!text-\[\#e31e24\] {
+    color: #e31e24 !important;
   }
   .\!text-\[\#45c4a0\] {
     color: #45c4a0 !important;
@@ -5833,8 +5833,8 @@
   .text-\[\#343f52\] {
     color: #343f52;
   }
-  .text-\[\#3f78e0\] {
-    color: #3f78e0;
+  .text-\[\#e31e24\] {
+    color: #e31e24;
   }
   .text-\[\#45c4a0\] {
     color: #45c4a0;
@@ -7078,10 +7078,10 @@
       border-style: solid;
     }
   }
-  .before\:border-\[\#3f78e0\] {
+  .before\:border-\[\#e31e24\] {
     &::before {
       content: var(--tw-content);
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .before\:border-\[\#262b32\] {
@@ -7150,10 +7150,10 @@
       background-color: #343f52;
     }
   }
-  .before\:bg-\[\#3f78e0\] {
+  .before\:bg-\[\#e31e24\] {
     &::before {
       content: var(--tw-content);
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .before\:bg-\[\#7cb798\] {
@@ -7423,10 +7423,10 @@
       font-weight: var(--font-weight-normal);
     }
   }
-  .before\:\!text-\[\#3f78e0\] {
+  .before\:\!text-\[\#e31e24\] {
     &::before {
       content: var(--tw-content);
-      color: #3f78e0 !important;
+      color: #e31e24 !important;
     }
   }
   .before\:\!text-\[\#54a8c7\] {
@@ -10264,10 +10264,10 @@
       border-style: solid;
     }
   }
-  .after\:border-\[\#3f78e0\] {
+  .after\:border-\[\#e31e24\] {
     &::after {
       content: var(--tw-content);
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .after\:border-\[\#262b32\] {
@@ -10348,10 +10348,10 @@
       background-color: #ffffff !important;
     }
   }
-  .after\:bg-\[\#3f78e0\] {
+  .after\:bg-\[\#e31e24\] {
     &::after {
       content: var(--tw-content);
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .after\:bg-\[\#e0e9fa\] {
@@ -10531,10 +10531,10 @@
       color: #343f52 !important;
     }
   }
-  .after\:\!text-\[\#3f78e0\] {
+  .after\:\!text-\[\#e31e24\] {
     &::after {
       content: var(--tw-content);
-      color: #3f78e0 !important;
+      color: #e31e24 !important;
     }
   }
   .after\:\!text-\[\#7cb798\] {
@@ -10742,10 +10742,10 @@
       }
     }
   }
-  .hover\:\!border-\[\#3f78e0\] {
+  .hover\:\!border-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
-        border-color: #3f78e0 !important;
+        border-color: #e31e24 !important;
       }
     }
   }
@@ -10903,10 +10903,10 @@
       }
     }
   }
-  .hover\:bg-\[\#3f78e0\] {
+  .hover\:bg-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
-        background-color: #3f78e0;
+        background-color: #e31e24;
       }
     }
   }
@@ -11057,10 +11057,10 @@
       }
     }
   }
-  .hover\:\!text-\[\#3f78e0\] {
+  .hover\:\!text-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
-        color: #3f78e0 !important;
+        color: #e31e24 !important;
       }
     }
   }
@@ -11249,12 +11249,12 @@
       }
     }
   }
-  .hover\:after\:\!text-\[\#3f78e0\] {
+  .hover\:after\:\!text-\[\#e31e24\] {
     &:hover {
       @media (hover: hover) {
         &::after {
           content: var(--tw-content);
-          color: #3f78e0 !important;
+          color: #e31e24 !important;
         }
       }
     }
@@ -11517,9 +11517,9 @@
       border-color: #343f52;
     }
   }
-  .active\:border-\[\#3f78e0\] {
+  .active\:border-\[\#e31e24\] {
     &:active {
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .active\:border-\[\#45c4a0\] {
@@ -11597,9 +11597,9 @@
       background-color: #343f52;
     }
   }
-  .active\:bg-\[\#3f78e0\] {
+  .active\:bg-\[\#e31e24\] {
     &:active {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .active\:bg-\[\#45c4a0\] {
@@ -11682,9 +11682,9 @@
       border-color: #343f52;
     }
   }
-  .disabled\:border-\[\#3f78e0\] {
+  .disabled\:border-\[\#e31e24\] {
     &:disabled {
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   .disabled\:border-\[\#45c4a0\] {
@@ -11782,9 +11782,9 @@
       background-color: #343f52;
     }
   }
-  .disabled\:bg-\[\#3f78e0\] {
+  .disabled\:bg-\[\#e31e24\] {
     &:disabled {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   .disabled\:bg-\[\#e31e24\] {
@@ -17165,7 +17165,7 @@ _:default:not(:root:root),hr.double {
   content: var(--tw-content);
 }
 .divider.divider-alt:after {
-  margin-top: calc(var(--spacing) * 0);
+  margin-top: calc(var(--spacing) * 2);
   margin-bottom: -5px;
 }
 [class*=divider-v-] {
@@ -17262,7 +17262,7 @@ hr {
   opacity: 100%;
 }
 .h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
-  margin-top: calc(var(--spacing) * 0);
+  margin-top: calc(var(--spacing) * 2);
   margin-bottom: calc(var(--spacing) * 2);
   --tw-leading: 1.2;
   line-height: 1.2;
@@ -17330,7 +17330,7 @@ a {
   text-decoration-line: none;
 }
 a:hover {
-  color: #3f78e0;
+  color: #e31e24;
 }
 a:not([href]):not([class]),a:not([href]):not([class]):hover {
   color: inherit;
@@ -17700,10 +17700,10 @@ textarea.form-control-sm {
   background-repeat: no-repeat;
   vertical-align: top;
   &:checked {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:checked {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
   &:focus {
     border-color: rgba(8,60,130,0.1);
@@ -17742,8 +17742,8 @@ textarea.form-control-sm {
   --form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='1.5' fill='%23fff'/%3e%3c/svg%3e");
 }
 .form-check-input[type=checkbox]:indeterminate {
-  border-color: #3f78e0;
-  background-color: #3f78e0;
+  border-color: #e31e24;
+  background-color: #e31e24;
   --form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
 }
 .form-check-input:disabled {
@@ -18360,19 +18360,19 @@ textarea.form-control.is-invalid {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:focus {
     background-color: inherit;
   }
   &:focus {
-    color: #3f78e0;
+    color: #e31e24;
   }
 }
 .dropdown-item.active,.dropdown-item:active {
   background-color: inherit;
-  color: #3f78e0;
+  color: #e31e24;
   text-decoration-line: none;
 }
 .dropdown-item.disabled,.dropdown-item:disabled {
@@ -18392,7 +18392,7 @@ textarea.form-control.is-invalid {
   padding-left: 1.5rem;
   font-size: 0.7rem;
   white-space: nowrap;
-  color: #3f78e0;
+  color: #e31e24;
 }
 .btn-group>.btn {
   position: relative;
@@ -18476,11 +18476,11 @@ textarea.form-control.is-invalid {
   transition-timing-function: var(--ease-in-out);
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:focus {
-    color: #3f78e0;
+    color: #e31e24;
   }
   &:focus-visible {
     --tw-shadow: 0 0 0 0.25rem var(--tw-shadow-color, rgba(63,120,224,0.25));
@@ -18522,7 +18522,7 @@ textarea.form-control.is-invalid {
 .nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active {
   border-color: rgba(164,174,198,0.2);
   background-color: var(--color-white);
-  color: #3f78e0;
+  color: #e31e24;
 }
 .nav-tabs .dropdown-menu {
   margin-top: calc(-1 * 1px);
@@ -18537,7 +18537,7 @@ textarea.form-control.is-invalid {
 }
 .nav-pills .nav-link.active,.nav-pills .show>.nav-link {
   background-color: var(--color-white);
-  color: #3f78e0;
+  color: #e31e24;
 }
 .nav-underline {
   gap: 1rem;
@@ -18597,10 +18597,10 @@ textarea.form-control.is-invalid {
   padding-block: calc(var(--spacing) * 0);
   font-size: 0.7rem;
   white-space: nowrap;
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-brand:focus,.navbar-brand:hover {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-nav {
   margin-bottom: calc(var(--spacing) * 0);
@@ -18614,7 +18614,7 @@ textarea.form-control.is-invalid {
   color: #343f52;
 }
 .navbar-nav .nav-link.active,.navbar-nav .nav-link.show {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-nav .dropdown-menu {
   position: static;
@@ -18812,7 +18812,7 @@ textarea.form-control.is-invalid {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:focus {
@@ -18822,7 +18822,7 @@ textarea.form-control.is-invalid {
     background-color: #ffffff;
   }
   &:focus {
-    color: #3f78e0;
+    color: #e31e24;
   }
   &:focus {
     --tw-shadow: unset;
@@ -18839,7 +18839,7 @@ textarea.form-control.is-invalid {
   z-index: 3;
   border-color: rgba(164,174,198,0.2);
   background-color: #ffffff;
-  color: #3f78e0;
+  color: #e31e24;
 }
 .disabled>.page-link,.page-link.disabled {
   pointer-events: none;
@@ -19223,7 +19223,7 @@ blockquote.text-center.icon-top:before {
   color: #aab0bc;
 }
 .filter:not(.basic-filter) ul li a.active {
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
 }
 .filter:not(.basic-filter).dark-filter ul li+li:before {
   background-color: rgba(255,255,255,.2);
@@ -19255,7 +19255,7 @@ blockquote.text-center.icon-top:before {
   color: #60697b;
 }
 .filter.basic-filter ul li a.active,.filter.basic-filter ul li a:hover {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .filter.basic-filter.dark-filter ul li a.active,.filter.basic-filter.dark-filter ul li a:hover {
   color: var(--color-white);
@@ -19583,7 +19583,7 @@ input,select,textarea {
   flex-wrap: wrap;
 }
 .picker label[for*=size]>input:checked~span {
-  background-color: #3f78e0;
+  background-color: #e31e24;
   color: var(--color-white);
 }
 .picker label[for*=color]>input:checked~span {
@@ -19826,10 +19826,10 @@ button:focus {
   outline: 0;
 }
 .btn-blue.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-sky.btn-expand {
@@ -19938,10 +19938,10 @@ button:focus {
   }
 }
 .btn-primary.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-blue, .btn-sky, .btn-purple, .btn-grape, .btn-violet, .btn-pink, .btn-fuchsia, .btn-red, .btn-orange, .btn-yellow, .btn-green, .btn-leaf, .btn-aqua, .btn-navy, .btn-ash, .btn-white, .btn-primary {
@@ -19955,7 +19955,7 @@ button:focus {
 .btn-soft-blue {
   border-color: #e0e9fa;
   background-color: #e0e9fa;
-  color: #3f78e0;
+  color: #e31e24;
   &:hover {
     @media (hover: hover) {
       border-color: #e0e9fa;
@@ -19968,7 +19968,7 @@ button:focus {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:active {
@@ -19978,18 +19978,18 @@ button:focus {
     background-color: #e0e9fa;
   }
   &:active {
-    color: #3f78e0;
+    color: #e31e24;
   }
 }
 .btn-soft-blue.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     background-color: #e0e9fa;
   }
 }
 .btn-soft-blue.btn-expand i,.btn-soft-blue.btn-expand:before,.btn-soft-blue.btn-expand:hover,.btn-soft-blue.btn-expand:hover:before {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .btn-soft-sky {
   border-color: #e5f4fd;
@@ -20579,7 +20579,7 @@ button:focus {
 .btn-soft-primary {
   border-color: #e0e9fa;
   background-color: #e0e9fa;
-  color: #3f78e0;
+  color: #e31e24;
   &:hover {
     @media (hover: hover) {
       border-color: #e0e9fa;
@@ -20592,7 +20592,7 @@ button:focus {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
   &:active {
@@ -20602,18 +20602,18 @@ button:focus {
     background-color: #e0e9fa;
   }
   &:active {
-    color: #3f78e0;
+    color: #e31e24;
   }
 }
 .btn-soft-primary.btn-expand {
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     background-color: #e0e9fa !important;
   }
 }
 .btn-soft-primary.btn-expand i,.btn-soft-primary.btn-expand:before,.btn-soft-primary.btn-expand:hover,.btn-soft-primary.btn-expand:hover:before {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .btn-soft-ash,.btn-white {
   color: #262b32 !important;
@@ -20655,40 +20655,40 @@ button:focus {
 .btn-primary {
   &:hover {
     @media (hover: hover) {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   &:active {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:active {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-outline-primary {
-  border-color: #3f78e0;
-  color: #3f78e0;
+  border-color: #e31e24;
+  color: #e31e24;
   &:hover {
     @media (hover: hover) {
-      border-color: #3f78e0;
+      border-color: #e31e24;
     }
   }
   &:hover {
     @media (hover: hover) {
-      background-color: #3f78e0;
+      background-color: #e31e24;
     }
   }
   &:active {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:active {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
   &:disabled {
-    border-color: #3f78e0;
+    border-color: #e31e24;
   }
   &:disabled {
-    background-color: #3f78e0;
+    background-color: #e31e24;
   }
 }
 .btn-gradient {
@@ -20740,10 +20740,10 @@ button:focus {
   background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0)),linear-gradient(45deg,#08aeea 0,#2af598 100%);
 }
 .gradient-7 {
-  background-image: linear-gradient(100deg,#e31e24 20%,#3f78e0 85%);
+  background-image: linear-gradient(100deg,#e31e24 20%,#e31e24 85%);
 }
 .gradient-7.btn-outline-gradient,.gradient-7.btn-outline-gradient span {
-  background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0)),linear-gradient(100deg,#e31e24 20%,#3f78e0 85%);
+  background-image: linear-gradient(rgba(255,255,255,0),rgba(255,255,255,0)),linear-gradient(100deg,#e31e24 20%,#e31e24 85%);
 }
 .gradient-8 {
   background-image: linear-gradient(0deg,#2c46a7,#3757c4);
@@ -20951,7 +20951,7 @@ button:focus {
   border-width: 4px;
   --tw-border-style: solid;
   border-style: solid;
-  border-color: #3f78e0;
+  border-color: #e31e24;
   background-color: inherit;
   --tw-shadow: 0 0 #0000;
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
@@ -21065,7 +21065,7 @@ button:focus {
   padding-block: calc(var(--spacing) * 0);
 }
 .navbar-expand.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .navbar-expand .dropdown-mega,.navbar-expand .navbar-nav {
   position: static;
@@ -21319,7 +21319,7 @@ button:focus {
   font-size: 0.85rem;
 }
 .navbar-light .language-select .dropdown-toggle:after {
-  color: #3f78e0;
+  color: #e31e24;
 }
 .share-dropdown .dropdown-toggle:after {
   display: none;
@@ -21381,11 +21381,11 @@ button:focus {
   font-size: 0.85rem;
 }
 .nav-tabs.nav-tabs-basic .nav-link:focus,.nav-tabs.nav-tabs-basic .nav-link:hover {
-  border-color: #3f78e0;
+  border-color: #e31e24;
 }
 .nav-tabs.nav-tabs-basic .nav-item.show .nav-link,.nav-tabs.nav-tabs-basic .nav-link.active {
-  border-color: #3f78e0;
-  color: #3f78e0;
+  border-color: #e31e24;
+  color: #e31e24;
 }
 .nav-tabs.nav-pills {
   border-color: transparent;
@@ -21478,8 +21478,8 @@ button:focus {
   display: inline-block;
 }
 .navbar.navbar-light.fixed .btn:not(.btn-expand):not(.btn-gradient) {
-  border-color: #3f78e0;
-  background-color: #3f78e0;
+  border-color: #e31e24;
+  background-color: #e31e24;
   color: var(--color-white) !important;
 }
 .navbar.navbar-bg-light {
@@ -21760,7 +21760,7 @@ button.hamburger span,button.hamburger:before {
   font-size: 0.85rem;
   --tw-font-weight: var(--font-weight-bold);
   font-weight: var(--font-weight-bold);
-  color: #3f78e0;
+  color: #e31e24;
   transition-property: all;
   transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
   transition-duration: var(--tw-duration, var(--default-transition-duration));
@@ -21807,7 +21807,7 @@ button.hamburger span,button.hamburger:before {
   }
   &::before {
     content: var(--tw-content);
-    color: #3f78e0;
+    color: #e31e24;
   }
   &::before {
     content: var(--tw-content);
@@ -21854,7 +21854,7 @@ button.hamburger span,button.hamburger:before {
   font-size: 0.85rem;
   --tw-font-weight: var(--font-weight-bold);
   font-weight: var(--font-weight-bold);
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     margin-right: 0.4rem;
@@ -21887,7 +21887,7 @@ button.hamburger span,button.hamburger:before {
   }
   &:hover {
     @media (hover: hover) {
-      color: #3f78e0;
+      color: #e31e24;
     }
   }
 }
@@ -22063,7 +22063,7 @@ button.hamburger span,button.hamburger:before {
   stroke: rgba(30,34,40,0.06);
 }
 .progressbar.blue svg path:last-child {
-  stroke: #3f78e0;
+  stroke: #e31e24;
 }
 .progressbar.semi-circle.blue svg path:first-child {
   stroke: rgba(63,120,224,0.1);
@@ -22177,7 +22177,7 @@ button.hamburger span,button.hamburger:before {
   stroke: rgba(38,43,50,0.1);
 }
 .progressbar.primary svg path:last-child {
-  stroke: #3f78e0;
+  stroke: #e31e24;
 }
 .progressbar.aqua svg path:last-child {
   stroke: #54a8c7;
@@ -22338,7 +22338,7 @@ button.hamburger span,button.hamburger:before {
   left: -1px;
   border-style: var(--tw-border-style);
   border-width: calc(0.8rem * 0.5) 0 calc(0.8rem * 0.5) 0.4rem;
-  border-left-color: #3f78e0;
+  border-left-color: #e31e24;
 }
 .tooltip .tooltip-arrow::before {
   position: absolute;
@@ -22354,7 +22354,7 @@ button.hamburger span,button.hamburger:before {
 .tooltip {
   pointer-events: none;
   border-radius: 0.4rem;
-  background-color: #3f78e0;
+  background-color: #e31e24;
   padding: 0.5rem 0.75rem;
   font-family: var(--font-Manrope);
   --tw-font-weight: var(--font-weight-medium);
@@ -22373,7 +22373,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before, .bs-tooltip-top .tooltip-arrow::before {
   top: -1px;
   border-width: 0.4rem calc(0.8rem * .5) 0;
-  border-top-color: #3f78e0;
+  border-top-color: #e31e24;
 }
 .tooltip .tooltip-arrow::before {
   position: absolute;
@@ -22391,7 +22391,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before, .bs-tooltip-end .tooltip-arrow::before {
   right: -1px;
   border-width: calc(0.8rem * .5) 0.4rem calc(0.8rem * .5) 0;
-  border-right-color: #3f78e0;
+  border-right-color: #e31e24;
 }
 .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow, .bs-tooltip-bottom .tooltip-arrow {
   top: calc(-1 * 0.4rem);
@@ -22399,7 +22399,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before, .bs-tooltip-bottom .tooltip-arrow::before {
   bottom: -1px;
   border-width: 0 calc(0.8rem * .5) 0.4rem;
-  border-bottom-color: #3f78e0;
+  border-bottom-color: #e31e24;
 }
 .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow, .bs-tooltip-start .tooltip-arrow {
   right: calc(-1 * 0.4rem);
@@ -22409,7 +22409,7 @@ button.hamburger span,button.hamburger:before {
 .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before, .bs-tooltip-start .tooltip-arrow::before {
   left: -1px;
   border-width: calc(0.8rem * .5)0 calc(0.8rem * .5) 0.4rem;
-  border-left-color: #3f78e0;
+  border-left-color: #e31e24;
 }
 .popover {
   z-index: 1070;
@@ -22695,7 +22695,7 @@ a.hover-2:hover:before {
   background-color: rgba(63,120,224,.7) !important;
 }
 .swiper-container.nav-color .swiper-button:hover {
-  background-color: #3f78e0 !important;
+  background-color: #e31e24 !important;
 }
 .swiper-container.nav-dark .swiper-button,.swiper-container.nav-dark .swiper-slide figure .item-link {
   background-color: rgba(0,0,0,.3) !important;
@@ -23096,10 +23096,10 @@ img.svg-inject {
   fill: #bfc2c8;
 }
 .solid .fill-primary,.solid .fill-secondary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid.text-blue .fill-primary,.solid.text-blue .fill-secondary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid.text-sky .fill-primary,.solid.text-sky .fill-secondary {
   fill: #5eb9f0;
@@ -23153,22 +23153,22 @@ img.svg-inject {
   fill: #262b32;
 }
 .solid.text-primary .fill-primary,.solid.text-primary .fill-secondary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono .fill-secondary {
   fill: #b2c9f3;
 }
 .solid-mono.text-primary .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono.text-primary .fill-secondary {
   fill: #b2c9f3;
 }
 .solid-mono.text-blue .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-mono.text-blue .fill-secondary {
   fill: #b2c9f3;
@@ -23288,7 +23288,7 @@ img.svg-inject {
   fill: #5eb9f0;
 }
 .solid-duo.text-blue-pink .fill-primary {
-  fill: #3f78e0;
+  fill: #e31e24;
 }
 .solid-duo.text-purple-aqua .fill-secondary {
   fill: #8ce0f1;
@@ -23381,7 +23381,7 @@ img.svg-inject {
   fill: #a09ed6 !important;
 }
 .solid-mono.text-primary .fill-primary {
-  fill: #3f78e0 !important;
+  fill: #e31e24 !important;
 }
 .solid-mono.text-primary .fill-secondary {
   fill: #b2c9f3 !important;
@@ -23450,7 +23450,7 @@ img.svg-inject {
   fill: #b2c9f3 !important;
 }
 .solid-mono.text-blue .fill-primary {
-  fill: #3f78e0 !important;
+  fill: #e31e24 !important;
 }
 .solid-mono.text-fuchsia .fill-secondary {
   fill: #f5c3e1 !important;
@@ -23644,7 +23644,7 @@ figure.overlay img {
   background-image: linear-gradient(45deg,#08aeea 0,#2af598 100%);
 }
 .overlay.overlay-gradient-7 span.bg {
-  background-image: linear-gradient(100deg,#e31e24 20%,#3f78e0 85%);
+  background-image: linear-gradient(100deg,#e31e24 20%,#e31e24 85%);
 }
 .overlay.overlay-gradient-8 span.bg {
   background-image: linear-gradient(0deg,#2c46a7,#3757c4);
@@ -23900,7 +23900,7 @@ video.player {
 }
 .plyr__control--overlaid:focus, .plyr__control--overlaid:hover {
   background-color: var(--color-white) !important;
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
   --tw-shadow: 0 0 1.25rem var(--tw-shadow-color, rgba(30,34,40,0.04));
   box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
   transition-property: all;
@@ -24039,7 +24039,7 @@ video.player {
   inset-block: calc(var(--spacing) * 0);
   left: calc(var(--spacing) * 0);
   width: 0.6rem;
-  color: #3f78e0;
+  color: #e31e24;
   &::before {
     content: var(--tw-content);
     top: 0.2rem;
@@ -24168,7 +24168,7 @@ table.shopping-cart td {
   background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#fab758 1.6px,#fab758 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
 }
 .bg-line.blue {
-  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#3f78e0 1.6px,#3f78e0 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
+  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#e31e24 1.6px,#e31e24 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
 }
 .bg-dot.sky {
   background-image: radial-gradient(#5eb9f0 2px,transparent 2.5px);
@@ -24192,10 +24192,10 @@ table.shopping-cart td {
   background-image: radial-gradient(#fab758 2px, transparent 2.5px);
 }
 .bg-dot.blue {
-  background-image: radial-gradient(#3f78e0 2px, transparent 2.5px);
+  background-image: radial-gradient(#e31e24 2px, transparent 2.5px);
 }
 .bg-line.primary {
-  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#3f78e0 1.6px,#3f78e0 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
+  background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) .8px,#e31e24 1.6px,#e31e24 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
 }
 .bg-line.purple {
   background: repeating-linear-gradient(-55deg,rgba(255,255,255,0) 0.8px,#747ed1 1.6px,#747ed1 3px,rgba(255,255,255,0) 3.8px,rgba(255,255,255,0) 10px);
@@ -24242,10 +24242,10 @@ footer [class*=col-] .widget+.widget {
   color: inherit;
 }
 .sidebar nav .nav-link.active {
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
 }
 .list-unstyled li a.active {
-  color: #3f78e0 !important;
+  color: #e31e24 !important;
 }
 #comments ul.children {
   margin-inline: calc(var(--spacing) * 0);
@@ -24521,7 +24521,7 @@ footer [class*=col-] .widget+.widget {
     padding: calc(var(--spacing) * 0);
   }
   .navbar-expand-xxl.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-xxl .dropdown-mega,.navbar-expand-xxl .navbar-nav {
     position: static;
@@ -24801,7 +24801,7 @@ footer [class*=col-] .widget+.widget {
     font-size: 1.35rem;
   }
   .navbar-expand-xl.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-xl .dropdown-mega,.navbar-expand-xl .navbar-nav {
     position: static;
@@ -27735,7 +27735,7 @@ footer [class*=col-] .widget+.widget {
     border-bottom-left-radius: 0.8rem;
   }
   .navbar-expand-lg.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-lg .dropdown-mega,.navbar-expand-lg .navbar-nav {
     position: static;
@@ -28359,7 +28359,7 @@ footer [class*=col-] .widget+.widget {
     border-radius: var(--radius-2xl);
   }
   .navbar-expand-md.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-md .dropdown-mega,.navbar-expand-md .navbar-nav {
     position: static;
@@ -31130,7 +31130,7 @@ footer [class*=col-] .widget+.widget {
     text-align: center;
   }
   .navbar-expand-sm.navbar-light .dropdown:not(.dropdown-submenu)>.dropdown-toggle:after {
-    color: #3f78e0;
+    color: #e31e24;
   }
   .navbar-expand-sm .dropdown-mega,.navbar-expand-sm .navbar-nav {
     position: static;
diff --git a/public/html/terms.html b/public/html/terms.html
index 90d657a..8faa51f 100644
--- a/public/html/terms.html
+++ b/public/html/terms.html
@@ -536,13 +536,13 @@
               <li class="nav-item dropdown language-select uppercase group">
                 <a class="nav-link dropdown-item dropdown-toggle" href="#" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">En</a>
                 <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">En</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">De</a></li>
-                  <li class="nav-item"><a class="dropdown-item hover:!text-[#3f78e0] hover:bg-[inherit] " href="#">Es</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">En</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">De</a></li>
+                  <li class="nav-item"><a class="dropdown-item hover:!text-[#e31e24] hover:bg-[inherit] " href="#">Es</a></li>
                 </ul>
               </li>
               <li class="nav-item hidden xl:block lg:block md:block">
-                <a class='btn btn-sm btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
+                <a class='btn btn-sm btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]' href='contact.html'>Contact</a>
               </li>
               <li class="nav-item xl:!hidden lg:!hidden">
                 <button class="hamburger offcanvas-nav-btn"><span></span></button>
@@ -564,7 +564,7 @@
             <h1 class="!text-[calc(1.365rem_+_1.38vw)] font-bold !leading-[1.2] xl:!text-[2.4rem] !mb-3">Terms and Conditions</h1>
             <nav class="inline-block" aria-label="breadcrumb">
               <ol class="breadcrumb flex flex-wrap bg-[none] !mb-4 p-0 !rounded-none list-none">
-                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#3f78e0]" href="#">Home</a></li>
+                <li class="breadcrumb-item flex !text-[#60697b]"><a class="!text-[#60697b] hover:!text-[#e31e24]" href="#">Home</a></li>
                 <li class="breadcrumb-item active flex !text-[#60697b] !pl-2 before:font-normal before:!flex before:items-center before:text-[rgba(96,105,123,.35)] before:content-['\e931'] before:text-[0.9rem] before:-mt-px before:!pr-2 before:font-Unicons" aria-current="page">Terms and Conditions</li>
               </ol>
             </nav>
@@ -605,10 +605,10 @@
                 <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
                 <p>Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas sed diam eget risus varius blandit sit amet non magna. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit. Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem.</p>
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary  !mb-0">
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
               </div>
               <!--/.card-body -->
@@ -622,10 +622,10 @@
                 <p>Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam quis risus eget urna mollis ornare vel eu leo. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
                 <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary">
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
                 <p class="!mb-0">Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas sed diam eget risus varius blandit sit amet non magna. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit. Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem.</p>
               </div>
@@ -652,10 +652,10 @@
                 <p>Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Cras mattis consectetur purus sit amet fermentum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla vitae elit libero, a pharetra augue. Nullam quis risus eget urna mollis ornare vel eu leo. Cras justo odio, dapibus ac facilisis in, egestas eget quam.</p>
                 <p>Sed posuere consectetur est at lobortis. Maecenas faucibus mollis interdum. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec id elit non mi porta gravida at eget metus. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.</p>
                 <ul class="pl-0 list-none bullet-bg bullet-soft-primary">
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
-                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#3f78e0] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Aenean eu leo quam ornare curabitur blandit tempus.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Nullam quis risus eget urna mollis ornare donec elit.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Etiam porta sem malesuada magna mollis euismod.</span></li>
+                  <li class="relative !mt-[0.35rem] flex items-center"><span class="pr-[.75rem]"><i class="uil uil-check w-4 h-4 text-[0.8rem] leading-none !tracking-[normal] !text-center flex justify-center items-center bg-[#dce7f9] !text-[#e31e24] rounded-[100%] top-[0.2rem] before:content-['\e9dd'] before:align-middle before:table-cell"></i></span><span>Fermentum massa vivamus faucibus amet euismod.</span></li>
                 </ul>
                 <p class="!mb-0">Nullam quis risus eget urna mollis ornare vel eu leo. Maecenas sed diam eget risus varius blandit sit amet non magna. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nullam id dolor id nibh ultricies vehicula ut id elit. Donec ullamcorper nulla non metus auctor fringilla. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam porta sem malesuada magna mollis euismod. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Nulla vitae elit libero, a pharetra augue. Curabitur blandit tempus porttitor. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus. Aenean eu leo quam. Pellentesque ornare sem.</p>
               </div>
@@ -718,7 +718,7 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Get in Touch</h4>
             <address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">ÇAMTEPE MAH. MAHMUT TEVFİK ATAY BUL. GAZİANTEP TEKNOPARK NO: 4A İÇ KAPI NO: 1 ŞAHİNBEY / GAZİANTEP</address>
-            <a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
+            <a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:first.last@email.com">info@truncgil.com</a><br> 00 (123) 456 78 90
           </div>
           <!-- /.widget -->
         </div>
@@ -727,11 +727,11 @@
           <div class="widget !text-[#cacaca]">
             <h4 class="widget-title !text-white !mb-3">Learn More</h4>
             <ul class="pl-0 list-none   !mb-0">
-              <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">About Us</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Our Story</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Projects</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Terms of Use</a></li>
-              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">Privacy Policy</a></li>
+              <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">About Us</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Our Story</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Projects</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Terms of Use</a></li>
+              <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">Privacy Policy</a></li>
             </ul>
           </div>
           <!-- /.widget -->
@@ -749,7 +749,7 @@
                     <div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
                       <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL2">
                       <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL2">Email Address</label>
-                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
+                      <input type="submit" value="Join" name="subscribe" id="mc-embedded-subscribe2" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none hover:!translate-none border-0">
                     </div>
                     <div id="mce-responses2" class="clear">
                       <div class="response" id="mce-error-response2" style="display:none"></div>
@@ -772,9 +772,9 @@
     </div>
     <!-- /.container -->
   </footer>
-  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#3f78e0] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
+  <div class="progress-wrap fixed w-[2.3rem] h-[2.3rem] cursor-pointer block shadow-[inset_0_0_0_0.1rem_rgba(128,130,134,0.25)] z-[1010] opacity-0 invisible translate-y-3 transition-all duration-[0.2s] ease-[linear,margin-right] delay-[0s] rounded-[100%] right-6 bottom-6 motion-reduce:transition-none after:absolute after:content-['\e951'] after:text-center after:leading-[2.3rem] after:text-[1.2rem] after:!text-[#e31e24] after:h-[2.3rem] after:w-[2.3rem] after:cursor-pointer after:block after:z-[1] after:transition-all after:duration-[0.2s] after:ease-linear after:left-0 after:top-0 motion-reduce:after:transition-none after:font-Unicons">
     <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
-      <path class="fill-none stroke-[#3f78e0] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
+      <path class="fill-none stroke-[#e31e24] stroke-[4] box-border transition-all duration-[0.2s] ease-linear motion-reduce:transition-none" d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98" />
     </svg>
   </div>
   <script src="../assets/js/plugins.js"></script>
diff --git a/resources/views/blog/index.blade.php b/resources/views/blog/index.blade.php
index 038d1f3..e14832f 100644
--- a/resources/views/blog/index.blade.php
+++ b/resources/views/blog/index.blade.php
@@ -40,7 +40,7 @@
                 <div class="card">
                   @if($post->featured_image_url)
                     <figure class="card-img-top overlay overlay-1 hover-scale group">
-                      <a class="!text-[#343f52] hover:!text-[#3f78e0]" href="{{ $blogUrl }}">
+                      <a class="!text-[#343f52] hover:!text-[#e31e24]" href="{{ $blogUrl }}">
                         <img class="!transition-all !duration-[0.35s] !ease-in-out group-hover:scale-105" src="{{ $imageUrl }}" alt="{{ $title }}">
                       </a>
                       <figcaption class="group-hover:opacity-100 absolute w-full h-full opacity-0 text-center px-4 py-3 inset-0 z-[5] pointer-events-none p-2">
@@ -51,13 +51,13 @@
                   <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[2rem_2.5rem_1.25rem] lg:!p-[2rem_2.5rem_1.25rem] md:!p-[2rem_2.5rem_1.25rem] max-md:pb-4">
                     <div class="post-header !mb-[.9rem]">
                       @if($categoryName)
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="{{ route('blog.index', ['category' => $categorySlug]) }}" class="hover" rel="category">{{ $categoryName }}</a>
                         </div>
                       @endif
                       <!-- /.post-category -->
                       <h2 class="post-title !mt-1 !leading-[1.35] !mb-0">
-                        <a class="!text-[#343f52] hover:!text-[#3f78e0]" href="{{ $blogUrl }}">{{ $title }}</a>
+                        <a class="!text-[#343f52] hover:!text-[#e31e24]" href="{{ $blogUrl }}">{{ $title }}</a>
                       </h2>
                     </div>
                     <!-- /.post-header -->
@@ -75,7 +75,7 @@
                       </li>
                       @if($authorName)
                         <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-                          <a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="{{ route('blog.index', ['author' => $post->author_id]) }}">
+                          <a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="{{ route('blog.index', ['author' => $post->author_id]) }}">
                             <i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i>
                             <span>{{ __('blog.by') }} {{ $authorName }}</span>
                           </a>
@@ -83,7 +83,7 @@
                       @endif
                       @if($post->allow_comments)
                         <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-                          <a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="{{ $blogUrl }}#comments">
+                          <a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="{{ $blogUrl }}#comments">
                             <i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>
                             <span>{{ $commentCount }} {{ __('blog.comments') }}</span>
                           </a>
@@ -135,13 +135,13 @@
                       <div class="card-body flex-[1_1_auto] p-[40px] xl:!p-[1.75rem_1.75rem_1rem_1.75rem] lg:!p-[1.75rem_1.75rem_1rem_1.75rem] md:!p-[1.75rem_1.75rem_1rem_1.75rem] max-md:pb-4">
                         <div class="post-header !mb-[.9rem]">
                           @if($categoryName)
-                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                            <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                               <a href="{{ route('blog.index', ['category' => $categorySlug]) }}" class="hover" rel="category">{{ $categoryName }}</a>
                             </div>
                           @endif
                           <!-- /.post-category -->
                           <h2 class="post-title h3 !mt-1 !mb-3">
-                            <a class="!text-[#343f52] hover:!text-[#3f78e0]" href="{{ $blogUrl }}">{{ $title }}</a>
+                            <a class="!text-[#343f52] hover:!text-[#e31e24]" href="{{ $blogUrl }}">{{ $title }}</a>
                           </h2>
                         </div>
                         <!-- /.post-header -->
@@ -159,7 +159,7 @@
                           </li>
                           @if($post->allow_comments)
                             <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-                              <a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="{{ $blogUrl }}#comments">
+                              <a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="{{ $blogUrl }}#comments">
                                 <i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>{{ $commentCount }}
                               </a>
                             </li>
diff --git a/resources/views/blog/show.blade.php b/resources/views/blog/show.blade.php
index 8ca6e3e..8d7909b 100644
--- a/resources/views/blog/show.blade.php
+++ b/resources/views/blog/show.blade.php
@@ -7,7 +7,7 @@
       <div class="md:w-10/12 lg:w-10/12 xl:w-8/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
         <div class="post-header !mb-[.9rem]">
           @if($post->category)
-            <div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] !mb-[0.4rem] text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+            <div class="inline-flex uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] !mb-[0.4rem] text-line relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
               <a href="{{ route('blog.index', ['category' => $post->category->slug]) }}" class="hover" rel="category">{{ $post->category->name }}</a>
             </div>
           @endif
@@ -22,14 +22,14 @@
             </li>
             @if($post->author)
               <li class="post-author inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-                <a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#">
+                <a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#">
                   <i class="uil uil-user pr-[0.2rem] align-[-.05rem] before:content-['\ed6f']"></i>
                   <span>{{ __('blog.by') }} {{ $post->author->name }}</span>
                 </a>
               </li>
             @endif
             <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0_.4rem] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-              <a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="#comments">
+              <a class="!text-[0.8rem] !text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="#comments">
                 <i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>
                 <span>{{ $post->comments_count ?? 0 }} {{ __('blog.comments') }}</span>
               </a>
@@ -119,7 +119,7 @@
                     </figure>
                     <div>
                       <h6>
-                        <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">{{ $post->author->name }}</a>
+                        <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">{{ $post->author->name }}</a>
                       </h6>
                       <span class="!text-[0.75rem] !text-[#aab0bc] m-0 p-0 list-none">{{ $post->author->role ?? __('blog.author') }}</span>
                     </div>
@@ -192,13 +192,13 @@
                             </figure>
                             <div class="post-header !mb-[.9rem]">
                               @if($relatedPost->category)
-                                <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                                <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                                   <a href="{{ route('blog.index', ['category' => $relatedPost->category->slug]) }}" class="hover" rel="category">{{ $relatedCategoryName }}</a>
                                 </div>
                               @endif
                               <!-- /.post-category -->
                               <h2 class="post-title h3 !mt-1 !mb-3">
-                                <a class="!text-[#343f52] hover:!text-[#3f78e0]" href="{{ $relatedUrl }}">{{ $relatedTitle }}</a>
+                                <a class="!text-[#343f52] hover:!text-[#e31e24]" href="{{ $relatedUrl }}">{{ $relatedTitle }}</a>
                               </h2>
                             </div>
                             <!-- /.post-header -->
@@ -209,7 +209,7 @@
                                   <span>{{ $relatedDate }}</span>
                                 </li>
                                 <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-                                  <a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="{{ $relatedUrl }}#comments">
+                                  <a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="{{ $relatedUrl }}#comments">
                                     <i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>{{ $relatedCommentCount }}
                                   </a>
                                 </li>
@@ -247,7 +247,7 @@
                               </figure>
                               <div>
                                 <h6 class="m-0 !mb-[0.2rem]">
-                                  <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">{{ $comment->name }}</a>
+                                  <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">{{ $comment->name }}</a>
                                 </h6>
                                 <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                   <li>
@@ -280,7 +280,7 @@
                                       </figure>
                                       <div>
                                         <h6 class="m-0 !mb-[0.2rem]">
-                                          <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">{{ $reply->name }}</a>
+                                          <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">{{ $reply->name }}</a>
                                         </h6>
                                         <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                           <li>
@@ -313,7 +313,7 @@
                                               </figure>
                                               <div>
                                                 <h6 class="m-0 !mb-[0.2rem]">
-                                                  <a href="#" class="!text-[#343f52] hover:!text-[#3f78e0]">{{ $nestedReply->name }}</a>
+                                                  <a href="#" class="!text-[#343f52] hover:!text-[#e31e24]">{{ $nestedReply->name }}</a>
                                                 </h6>
                                                 <ul class="!text-[0.7rem] !text-[#aab0bc] m-0 p-0 list-none">
                                                   <li>
@@ -386,7 +386,7 @@
                       </ul>
                     </div>
                   @endif
-                  <button type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0] active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
+                  <button type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24] active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] !mb-0 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
                     {{ __('blog.submit') }}
                   </button>
                 </form>
diff --git a/resources/views/components/custom/blog.blade.php b/resources/views/components/custom/blog.blade.php
index e172d1e..3004683 100644
--- a/resources/views/components/custom/blog.blade.php
+++ b/resources/views/components/custom/blog.blade.php
@@ -38,13 +38,13 @@
                     </figure>
                     <div class="post-header">
                       @if($categoryName)
-                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#3f78e0]">
+                        <div class="inline-flex !mb-[.4rem] uppercase !tracking-[0.02rem] text-[0.7rem] font-bold !text-[#aab0bc] relative align-top !pl-[1.4rem] before:content-[''] before:absolute before:inline-block before:translate-y-[-60%] before:w-3 before:h-[0.05rem] before:left-0 before:top-2/4 before:bg-[#e31e24]">
                           <a href="{{ route('blog.index', ['category' => $blog->category->slug ?? '']) }}" class="hover" rel="category">{{ $categoryName }}</a>
                         </div>
                       @endif
                       <!-- /.post-category -->
                       <h2 class="post-title h3 !mt-1 !mb-3">
-                        <a class="!text-[#343f52] hover:!text-[#3f78e0]" href="{{ $blogUrl }}">{{ $title }}</a>
+                        <a class="!text-[#343f52] hover:!text-[#e31e24]" href="{{ $blogUrl }}">{{ $title }}</a>
                       </h2>
                     </div>
                     <!-- /.post-header -->
@@ -58,7 +58,7 @@
                         @endif
                         @if($blog->allow_comments)
                           <li class="post-comments inline-block before:content-[''] before:inline-block before:w-[0.2rem] before:h-[0.2rem] before:opacity-50 before:m-[0_.6rem_0] before:rounded-[100%] before:align-[.15rem] before:bg-[#aab0bc]">
-                            <a class="!text-[#aab0bc] hover:!text-[#3f78e0] hover:!border-[#3f78e0]" href="{{ $blogUrl }}#comments">
+                            <a class="!text-[#aab0bc] hover:!text-[#e31e24] hover:!border-[#e31e24]" href="{{ $blogUrl }}#comments">
                               <i class="uil uil-comment pr-[0.2rem] align-[-.05rem] before:content-['\ea54']"></i>{{ $commentCount }}
                             </a>
                           </li>
diff --git a/resources/views/components/custom/language-selector.blade.php b/resources/views/components/custom/language-selector.blade.php
index 9ccf5ae..e675f3e 100644
--- a/resources/views/components/custom/language-selector.blade.php
+++ b/resources/views/components/custom/language-selector.blade.php
@@ -17,7 +17,7 @@
         <ul class="dropdown-menu group-hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]">
           @foreach($languages as $language)
             <li class="nav-item">
-              <a class="dropdown-item hover:!text-[#747ed1] {{ $language->code === $currentLang ? 'active font-bold !text-[#3f78e0]' : '' }}" 
+              <a class="dropdown-item hover:!text-[#747ed1] {{ $language->code === $currentLang ? 'active font-bold !text-[#e31e24]' : '' }}" 
                  href="{{ route('language.switch', $language->code) }}">
               {{ strtoupper($language->code) }}
               </a>
diff --git a/resources/views/components/front/footer.blade.php b/resources/views/components/front/footer.blade.php
index 16941cd..f07447b 100644
--- a/resources/views/components/front/footer.blade.php
+++ b/resources/views/components/front/footer.blade.php
@@ -23,7 +23,7 @@
 		  <div class="widget !text-[#cacaca]">
 			<h4 class="widget-title !text-white !mb-3">{{ t('İletişim') }}</h4>
 			<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">{{ setting('contact_address') }}</address>
-			<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:{{ setting('contact_email') }}">{{ setting('contact_email') }}</a><br> {{ setting('contact_phone') }}
+			<a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:{{ setting('contact_email') }}">{{ setting('contact_email') }}</a><br> {{ setting('contact_phone') }}
 		  </div>
 		  <!-- /.widget -->
 		</div>
@@ -32,11 +32,11 @@
 		  <div class="widget !text-[#cacaca]">
 			<h4 class="widget-title !text-white !mb-3">{{ t('Daha Fazla Bilgi') }}</h4>
 			<ul class="pl-0 list-none   !mb-0">
-			  <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Hakkımızda') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Hikayemiz') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Projelerimiz') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Kullanım Koşulları') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Gizlilik Politikası') }}</a></li>
+			  <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Hakkımızda') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Hikayemiz') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Projelerimiz') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Kullanım Koşulları') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Gizlilik Politikası') }}</a></li>
 			</ul>
 		  </div>
 		  <!-- /.widget -->
@@ -54,7 +54,7 @@
 					<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
 					  <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL">
 					  <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL">{{ t('E-posta Adresiniz') }}</label>
-					  <input type="submit" value="{{ t('Abone Ol') }}" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none border-0">
+					  <input type="submit" value="{{ t('Abone Ol') }}" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none border-0">
 					</div>
 					<div id="mce-responses" class="clear">
 					  <div class="response" id="mce-error-response" style="display:none"></div>
diff --git a/resources/views/components/front/menu-item.blade.php b/resources/views/components/front/menu-item.blade.php
index 52d4acc..778b2fd 100644
--- a/resources/views/components/front/menu-item.blade.php
+++ b/resources/views/components/front/menu-item.blade.php
@@ -20,41 +20,45 @@
         <ul class="dropdown-menu mega-menu">
             <li class="mega-menu-content">
                 <div class="flex flex-wrap mx-0 xl:mx-[-7.5px] lg:mx-[-7.5px]">
-                    <div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] max-w-full">
-                        <h6 class="dropdown-header !text-[#e31e24]">{{ __('Kategoriler') }}</h6>
-                        <ul class="pl-0 list-none xl:pb-1 lg:pb-1">
+                    <div class="xl:w-3/12 lg:w-3/12 w-full flex-[0_0_auto] max-w-full px-6">
+                        <h6 class="dropdown-header !text-[#e31e24] mb-4 mt-4 !pl-0">{{ __('Kategoriler') }}</h6>
+                        <ul class="pl-0 list-none mb-8">
                             @foreach($categories as $category)
                             <li class="w-full">
-                                <a class='dropdown-item hover:!text-[#e31e24]' href='#'>{{ $category->translate('title') }}</a>
+                                <a class='dropdown-item hover:!text-[#e31e24] !pl-0 !bg-transparent' href='#'>{{ $category->translate('title') }}</a>
                             </li>
                             @endforeach
                         </ul>
 
-                        <h6 class="dropdown-header !text-[#e31e24] mt-5">{{ __('Hizmetler') }}</h6>
-                        <ul class="pl-0 list-none xl:pb-1 lg:pb-1">
+                        <h6 class="dropdown-header !text-[#e31e24] mb-4 mt-4 !pl-0">{{ __('Hizmetler') }}</h6>
+                        <ul class="pl-0 list-none">
                             @foreach($services as $service)
                             <li class="w-full">
-                                <a class='dropdown-item hover:!text-[#e31e24]' href="{{ route('products.show', $service->slug) }}">{{ $service->translate('title') }}</a>
+                                <a class='dropdown-item hover:!text-[#e31e24] !pl-0 !bg-transparent' href="{{ route('products.show', $service->slug) }}">{{ $service->translate('title') }}</a>
                             </li>
                             @endforeach
                         </ul>
                     </div>
                     
-                    <div class="xl:w-9/12 lg:w-9/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid xl:pl-[15px] lg:pl-[15px]">
-                        <h6 class="dropdown-header !text-[#e31e24] !ml-[10px]">{{ __('Öne Çıkan Ürünler') }}</h6>
-                        <div class="flex flex-wrap p-2 gap-4">
+                    <div class="xl:w-9/12 lg:w-9/12 w-full flex-[0_0_auto] max-w-full xl:border-l-[rgba(164,174,198,0.2)] xl:border-l xl:border-solid lg:border-l-[rgba(164,174,198,0.2)] lg:border-l lg:border-solid xl:p-[50px] lg:pl-[50px] px-6 gradient-2 rounded-[.4rem]">
+                        <h6 class="dropdown-header !text-white mb-6 !p-0">{{ __('Öne Çıkan Ürünler') }}</h6>
+                        <div class="flex flex-wrap gap-4 mx-6">
                             @foreach($featuredProducts as $item)
-                            <div class="flex-none w-[185px]">
-                                <a class="dropdown-item group !bg-transparent !p-0 text-center block" href="{{ route('products.show', $item->slug) }}">
-                                    <figure class="!rounded-[.4rem] overflow-hidden w-[185px] h-[135px] !mb-2 shadow-sm border border-gray-100 mx-auto">
+                            <div class="flex-none" style="width: 183px;">
+                                <a class="group !bg-transparent mt-2 mb-2 !p-0 block transition-transform duration-300  hover:-translate-y-1" 
+                                   href="{{ route('products.show', $item->slug) }}"
+                                   data-bs-toggle="tooltip" 
+                                   data-bs-placement="top" 
+                                   title="{{ $item->translate('title') }}">
+                                    <figure style="width: 183px; height: 103px;"
+                                        class="!rounded-[.4rem] lift overflow-hidden !mb-2 shadow-[0_0.25rem_1.75rem_rgba(30,34,40,0.57)] mx-auto block transition-transform duration-300 group-hover:-translate-y-1 hidden xl:block lg:block ">
                                         @if($item->hero_image)
-                                            <img class="!rounded-[.4rem] w-full h-full object-cover transition-all duration-300 group-hover:scale-105" src="{{ \Storage::url($item->hero_image) }}" alt="{{ $item->translate('title') }}" width="185" height="135">
+                                            <img style="width: 183px; height: 103px;" class="!rounded-[.4rem] object-cover block" src="{{ \Storage::url($item->hero_image) }}" alt="{{ $item->translate('title') }}">
                                         @else
-                                            <img class="!rounded-[.4rem] w-full h-full object-cover" src="https://placehold.co/185x135?text={{ urlencode($item->translate('title')) }}" alt="{{ $item->translate('title') }}" width="185" height="135">
+                                            <img style="width: 183px; height: 103px;" class="!rounded-[.4rem] object-cover block" src="https://placehold.co/185x135?text={{ urlencode($item->translate('title')) }}" alt="{{ $item->translate('title') }}">
                                         @endif
                                     </figure>
                                     <span class="xl:!hidden lg:!hidden">{{ $item->translate('title') }}</span>
-                                    <span class="hidden xl:block lg:block text-xs font-bold text-gray-800 group-hover:text-[#e31e24] truncate w-full text-center">{{ $item->translate('title') }}</span>
                                 </a>
                             </div>
                             @endforeach
diff --git a/resources/views/front/products/show.blade.php b/resources/views/front/products/show.blade.php
index 7049ab5..508806c 100644
--- a/resources/views/front/products/show.blade.php
+++ b/resources/views/front/products/show.blade.php
@@ -10,9 +10,9 @@
             <div class="xl:w-10/12 lg:w-10/12 w-full flex-[0_0_auto] px-[15px] max-w-full !mx-auto">
                 <div class="post-header !mb-[.9rem]">
                     <div class="post-category text-line text-[#aab0bc] !mb-3">
-                        <span class="hover:!text-[#3f78e0]">{{ $product->type == 'product' ? 'Ürün' : 'Hizmet' }}</span>
+                        <span class="hover:!text-[#e31e24]">{{ $product->type == 'product' ? 'Ürün' : 'Hizmet' }}</span>
                         @if($product->category)
-                             / <span class="hover:!text-[#3f78e0]">{{ $product->category->translate('title') }}</span>
+                             / <span class="hover:!text-[#e31e24]">{{ $product->category->translate('title') }}</span>
                         @endif
                     </div>
                     <!-- /.post-category -->
diff --git a/resources/views/layouts/front.blade.php b/resources/views/layouts/front.blade.php
index 06bbf5c..6bd00e9 100644
--- a/resources/views/layouts/front.blade.php
+++ b/resources/views/layouts/front.blade.php
@@ -24,6 +24,26 @@
         color: #ffffff !important;
       }
     }
+    /* Mega Menu Tooltip Kırmızı Renk */
+    .mega-menu .tooltip {
+      background-color: #e31e24 !important;
+    }
+    .mega-menu .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before,
+    .mega-menu .bs-tooltip-top .tooltip-arrow::before {
+      border-top-color: #e31e24 !important;
+    }
+    .mega-menu .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before,
+    .mega-menu .bs-tooltip-end .tooltip-arrow::before {
+      border-right-color: #e31e24 !important;
+    }
+    .mega-menu .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before,
+    .mega-menu .bs-tooltip-bottom .tooltip-arrow::before {
+      border-bottom-color: #e31e24 !important;
+    }
+    .mega-menu .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before,
+    .mega-menu .bs-tooltip-start .tooltip-arrow::before {
+      border-left-color: #e31e24 !important;
+    }
   </style>
 </head>
 
@@ -52,3 +72,4 @@
 
 
 
+
diff --git a/resources/views/partials/footer.blade.php b/resources/views/partials/footer.blade.php
index ea37d26..9636776 100644
--- a/resources/views/partials/footer.blade.php
+++ b/resources/views/partials/footer.blade.php
@@ -23,7 +23,7 @@
 		  <div class="widget !text-[#cacaca]">
 			<h4 class="widget-title !text-white !mb-3">{{ t('İletişim') }}</h4>
 			<address class="xl:!pr-20 xxl:!pr-28 not-italic !leading-[inherit] block !mb-4">{{ setting('contact_address') }}</address>
-			<a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="mailto:{{ setting('contact_email') }}">{{ setting('contact_email') }}</a><br> {{ setting('contact_phone') }}
+			<a class="!text-[#cacaca] hover:!text-[#e31e24]" href="mailto:{{ setting('contact_email') }}">{{ setting('contact_email') }}</a><br> {{ setting('contact_phone') }}
 		  </div>
 		  <!-- /.widget -->
 		</div>
@@ -32,11 +32,11 @@
 		  <div class="widget !text-[#cacaca]">
 			<h4 class="widget-title !text-white !mb-3">{{ t('Daha Fazla Bilgi') }}</h4>
 			<ul class="pl-0 list-none   !mb-0">
-			  <li><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Hakkımızda') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Hikayemiz') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Projelerimiz') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Kullanım Koşulları') }}</a></li>
-			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#3f78e0]" href="#">{{ t('Gizlilik Politikası') }}</a></li>
+			  <li><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Hakkımızda') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Hikayemiz') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Projelerimiz') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Kullanım Koşulları') }}</a></li>
+			  <li class="!mt-[0.35rem]"><a class="!text-[#cacaca] hover:!text-[#e31e24]" href="#">{{ t('Gizlilik Politikası') }}</a></li>
 			</ul>
 		  </div>
 		  <!-- /.widget -->
@@ -54,7 +54,7 @@
 					<div class="!text-left input-group form-floating !relative flex flex-wrap items-stretch w-full">
 					  <input type="email" value="" name="EMAIL" class="required email form-control block w-full text-[12px] font-medium !leading-[1.7] appearance-none bg-clip-padding shadow-[0_0_1.25rem_rgba(30,34,40,0.04)] px-4 py-[0.6rem] rounded-[0.4rem] motion-reduce:transition-none     focus:shadow-[0_0_1.25rem_rgba(30,34,40,0.04),unset] disabled:bg-[#aab0bc] disabled:opacity-100 file:!mt-[-0.6rem] file:mr-[-1rem] file:!mb-[-0.6rem] file:ml-[-1rem] file:!text-[#60697b] file:bg-[#fefefe] file:pointer-events-none file:transition-all file:duration-[0.2s] file:ease-in-out file:px-4 file:py-[0.6rem] file:rounded-none motion-reduce:file:transition-none placeholder:!text-[#959ca9] placeholder:opacity-100 border border-solid !border-[rgba(255,255,255,0.1)] !text-[#cacaca]   bg-[rgba(255,255,255,.03)] focus-visible:!border-[rgba(63,120,224,0.5)]  " placeholder="" id="mce-EMAIL">
 					  <label class="!ml-[0.05rem] !text-[#959ca9] text-[.75rem] absolute z-[2] h-full overflow-hidden text-start text-ellipsis whitespace-nowrap pointer-events-none origin-[0_0] px-4 py-[0.6rem] left-0 top-0" for="mce-EMAIL">{{ t('E-posta Adresiniz') }}</label>
-					  <input type="submit" value="{{ t('Abone Ol') }}" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !relative z-[2] focus:z-[5] hover:!transform-none border-0">
+					  <input type="submit" value="{{ t('Abone Ol') }}" name="subscribe" id="mc-embedded-subscribe" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !relative z-[2] focus:z-[5] hover:!transform-none border-0">
 					</div>
 					<div id="mce-responses" class="clear">
 					  <div class="response" id="mce-error-response" style="display:none"></div>
diff --git a/resources/views/templates/home/contact.blade.php b/resources/views/templates/home/contact.blade.php
index fd0f1cf..5669031 100644
--- a/resources/views/templates/home/contact.blade.php
+++ b/resources/views/templates/home/contact.blade.php
@@ -43,3 +43,5 @@
 <!-- /.container -->
 </section>
 
+
+
diff --git a/resources/views/templates/home/human-centered.blade.php b/resources/views/templates/home/human-centered.blade.php
index b6e0f3a..b41eefb 100644
--- a/resources/views/templates/home/human-centered.blade.php
+++ b/resources/views/templates/home/human-centered.blade.php
@@ -19,3 +19,5 @@
 	<figure class="m-0 p-0"><img class="w-full max-w-full !h-auto" src="{{ asset('assets/img/photos/clouds.png') }}" alt="image"></figure>
 </section>
 
+
+
diff --git a/resources/views/templates/home/services-grid.blade.php b/resources/views/templates/home/services-grid.blade.php
index c474117..b7ae87b 100644
--- a/resources/views/templates/home/services-grid.blade.php
+++ b/resources/views/templates/home/services-grid.blade.php
@@ -65,3 +65,5 @@
 <!-- /.container -->
 </section>
 
+
+
diff --git a/resources/views/templates/home/solutions.blade.php b/resources/views/templates/home/solutions.blade.php
index 3cc6e00..f5ea633 100644
--- a/resources/views/templates/home/solutions.blade.php
+++ b/resources/views/templates/home/solutions.blade.php
@@ -33,3 +33,5 @@ Teknoloji ve yazılım odaklı bir güç olarak, işletmenizin dijital çağa ta
 <!-- /.container -->
 </section>
 
+
+
diff --git a/resources/views/templates/home/testimonials.blade.php b/resources/views/templates/home/testimonials.blade.php
index 334b4e7..5700eff 100644
--- a/resources/views/templates/home/testimonials.blade.php
+++ b/resources/views/templates/home/testimonials.blade.php
@@ -76,3 +76,5 @@
 <!-- /.container -->
 </section>
 
+
+
diff --git a/resources/views/templates/home/what-we-do.blade.php b/resources/views/templates/home/what-we-do.blade.php
index 8a8a692..0c5f69e 100644
--- a/resources/views/templates/home/what-we-do.blade.php
+++ b/resources/views/templates/home/what-we-do.blade.php
@@ -50,3 +50,5 @@
 <!-- /.container -->
 </section>
 
+
+
diff --git a/resources/views/templates/home/why-choose-us-features.blade.php b/resources/views/templates/home/why-choose-us-features.blade.php
index b6a6da0..5d9a079 100644
--- a/resources/views/templates/home/why-choose-us-features.blade.php
+++ b/resources/views/templates/home/why-choose-us-features.blade.php
@@ -67,3 +67,5 @@
 <!-- /.container -->
 </section>
 
+
+
diff --git a/resources/views/templates/iletisim.blade.php b/resources/views/templates/iletisim.blade.php
index d2137e6..a33879e 100644
--- a/resources/views/templates/iletisim.blade.php
+++ b/resources/views/templates/iletisim.blade.php
@@ -42,7 +42,7 @@
                   <div class="p-10 xl:!p-[4.5rem] lg:!p-[4.5rem] md:!p-12">
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-location-pin-alt before:content-['\ebd8']"></i> </div>
                       </div>
                       <div class="!self-start !justify-start">
                         <h5 class="!mb-1">{{ t('Adres') }}</h5>
@@ -52,7 +52,7 @@
                     <!--/div -->
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-phone-volume before:content-['\ec50']"></i> </div>
                       </div>
                       <div>
                         <h5 class="!mb-1">{{ t('Telefon') }}</h5>
@@ -62,7 +62,7 @@
                     <!--/div -->
                     <div class="flex flex-row">
                       <div>
-                        <div class="icon !text-[#3f78e0] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
+                        <div class="icon !text-[#e31e24] xl:!text-[1.4rem] !text-[calc(1.265rem_+_0.18vw)] !mr-4 !mt-[-0.25rem]"> <i class="uil uil-envelope before:content-['\eac8']"></i> </div>
                       </div>
                       <div>
                         <h5 class="!mb-1">{{ t('E-posta') }}</h5>
@@ -139,7 +139,7 @@
                 </div>
                 <!-- /column -->
                 <div class="w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center">
-                  <input type="submit" class="btn btn-primary !text-white !bg-[#3f78e0] border-[#3f78e0] hover:text-white hover:bg-[#3f78e0] hover:!border-[#3f78e0]   active:text-white active:bg-[#3f78e0] active:border-[#3f78e0] disabled:text-white disabled:bg-[#3f78e0] disabled:border-[#3f78e0] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="{{ t('Mesaj Gönder') }}">
+                  <input type="submit" class="btn btn-primary !text-white !bg-[#e31e24] border-[#e31e24] hover:text-white hover:bg-[#e31e24] hover:!border-[#e31e24]   active:text-white active:bg-[#e31e24] active:border-[#e31e24] disabled:text-white disabled:bg-[#e31e24] disabled:border-[#e31e24] !rounded-[50rem] btn-send !mb-3 hover:translate-y-[-0.15rem] hover:shadow-[0_0.25rem_0.75rem_rgba(30,34,40,0.15)]" value="{{ t('Mesaj Gönder') }}">
                   <p class="!text-[#aab0bc]"><strong>*</strong> {{ t('Bu alanlar zorunludur.') }}</p>
                 </div>
                 <!-- /column -->
@@ -168,17 +168,17 @@
           <div class="md:w-10/12 lg:w-9/12 xl:w-7/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !mx-auto">
             <div class="flex flex-wrap mx-[-15px] items-center counter-wrapper !mt-[-20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]" style="visibility: visible;">126</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]" style="visibility: visible;">126</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">{{ t('Tamamlanan Projeler') }}</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]" style="visibility: visible;">600+</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]" style="visibility: visible;">600+</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">{{ t('Memnuniyetli Müşteriler') }}</p>
               </div>
               <!--/column -->
               <div class="xl:w-4/12 lg:w-4/12 md:w-4/12 w-full flex-[0_0_auto] !px-[15px] max-w-full !text-center !mt-[20px] xl:!mt-0 lg:!mt-0 md:!mt-0">
-                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#3f78e0]" style="visibility: visible;">10+</h3>
+                <h3 class="counter counter-lg !text-[calc(1.345rem_+_1.14vw)] !tracking-[normal] !leading-none !mb-2 xl:!text-[2.2rem]  !text-[#e31e24]" style="visibility: visible;">10+</h3>
                 <p class=" text-[0.8rem] font-medium !mb-0">{{ t('Uzman Çalışanlar') }}</p>
               </div>
               <!--/column -->