diff --git a/resources/views/layout/navbar.blade.php b/resources/views/layout/navbar.blade.php
index 4423471..9231bfb 100644
--- a/resources/views/layout/navbar.blade.php
+++ b/resources/views/layout/navbar.blade.php
@@ -338,7 +338,7 @@
             href="javascript:void(0);"
             data-bs-toggle="dropdown">
             <div class="avatar avatar-online">
-                <img src="../../assets/img/avatars/1.png" alt class="rounded-circle" />
+                <img src="../../assets/img/avatars/3.jpg" alt class="rounded-circle" />
             </div>
             </a>
             <ul class="dropdown-menu dropdown-menu-end">
@@ -347,7 +347,7 @@
                 <div class="d-flex align-items-center">
                     <div class="flex-shrink-0 me-2">
                     <div class="avatar avatar-online">
-                        <img src="../../assets/img/avatars/1.png" alt class="rounded-circle" />
+                        <img src="../../assets/img/avatars/3.jpg" alt class="rounded-circle" />
                     </div>
                     </div>
                     <div class="flex-grow-1">
diff --git a/resources/views/produktivitas/petani/header.blade.php b/resources/views/produktivitas/petani/header.blade.php
index 8ecf1b9..b530a0a 100644
--- a/resources/views/produktivitas/petani/header.blade.php
+++ b/resources/views/produktivitas/petani/header.blade.php
@@ -1,3 +1,39 @@
+            <style>
+              @media (min-width: 768px) {
+                        .nav-pills-custom-spacing {
+                            display: flex;
+                            width: 100%;
+                            gap: 0.5rem;
+                            flex-wrap: nowrap !important;
+                            overflow-x: auto;
+                        }
+                        
+                        .nav-pills-custom-spacing::-webkit-scrollbar {
+                            display: none;
+                        }
+
+                        .nav-pills-custom-spacing .nav-item {
+                            margin-right: 0 !important;
+                            flex: 1;
+                        }
+                        
+                        .nav-pills-custom-spacing .nav-link {
+                            display: flex;
+                            justify-content: center;
+                            align-items: center;
+                            padding-left: 0.5rem !important; 
+                            padding-right: 0.5rem !important;
+                            width: 100%;
+                            white-space: nowrap;
+                            font-size: 0.9375rem !important;
+                        }
+
+                        .nav-pills-custom-spacing .nav-link i {
+                            margin-right: 0.4rem !important; 
+                        }
+                    }
+             </style>
+            
             <div class="row mb-4">
                 
                 <div class="col-md-4 mb-2 mb-md-0">
@@ -79,7 +115,7 @@
                                             </div>
                                             <span class="avatar">
                                                 <span class="avatar-initial rounded">
-                                                    <i class="icon-base ti tabler-user-star icon-22px"></i>
+                                                    <i class="icon-base ti tabler-user-star icon-22px text-heading"></i>
                                                 </span>
                                             </span>
                                         </div>
@@ -105,7 +141,7 @@
                                             </div>
                                             <span class="avatar">
                                                 <span class="avatar-initial rounded">
-                                                    <i class="icon-base ti tabler-trees icon-22px"></i>
+                                                    <i class="icon-base ti tabler-trees icon-22px text-heading"></i>
                                                 </span>
                                             </span>
                                         </div>
@@ -127,7 +163,7 @@
                                             </div>
                                             <span class="avatar">
                                                 <span class="avatar-initial rounded">
-                                                    <i class="icon-base ti tabler-books icon-22px"></i>
+                                                    <i class="icon-base ti tabler-books icon-22px text-heading"></i>
                                                 </span>
                                             </span>
                                         </div>
@@ -181,7 +217,7 @@
                                             </div>
                                             <span class="avatar">
                                                 <span class="avatar-initial rounded">
-                                                    <i class="icon-base ti tabler-seedling icon-22px"></i>
+                                                    <i class="icon-base ti tabler-seedling icon-22px text-heading"></i>
                                                 </span>
                                             </span>
                                         </div>
@@ -232,7 +268,7 @@
                                             </div>
                                             <span class="avatar">
                                                 <span class="avatar-initial rounded">
-                                                    <i class="icon-base ti tabler-social icon-22px"></i>
+                                                    <i class="icon-base ti tabler-social icon-22px text-heading"></i>
                                                 </span>
                                             </span>
                                         </div>
@@ -291,7 +327,7 @@
                                             </div>
                                             <span class="avatar">
                                                 <span class="avatar-initial rounded">
-                                                    <i class="icon-base ti tabler-building-store icon-22px"></i>
+                                                    <i class="icon-base ti tabler-building-store icon-22px text-heading"></i>
                                                 </span>
                                             </span>
                                         </div>
@@ -306,7 +342,7 @@
             
             <div class="nav-align-top">
                 @if(!$petani)
-                <ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2">
+                <ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2 nav-pills-custom-spacing">
                     <li class="nav-item">
                         <a class="nav-link active" href="{{ route('petani.create') }}">
                             <i class="icon-base ti tabler-user-check me-1_5 icon-sm"></i>Profil
@@ -314,22 +350,22 @@
                     </li>
                     <li class="nav-item">
                         <a class="nav-link" href="#" disabled data-bs-original-title="Lahan & Tanaman, isi profil terlebih dahulu" data-bs-toggle="tooltip" data-bs-placement="top">
-                          <i class="icon-base ti tabler-trees me-1_5 icon-sm"></i>Lahan & Tanaman
+                        <i class="icon-base ti tabler-trees me-1_5 icon-sm"></i>Lahan & Tanaman
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link" href="#" disabled data-bs-original-title="Praktik Budidaya, isi profil terlebih dahulu" data-bs-toggle="tooltip" data-bs-placement="top">
-                          <i class="icon-base ti tabler-seedling me-1_5 icon-sm"></i>Praktik Budidaya
+                        <i class="icon-base ti tabler-seedling me-1_5 icon-sm"></i>Praktik Budidaya
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link" href="#" disabled data-bs-original-title="Pendidikan & Pelatihan, isi profil terlebih dahulu" data-bs-toggle="tooltip" data-bs-placement="top">
-                          <i class="icon-base ti tabler-books me-1_5 icon-sm"></i>Pendidikan & Pelatihan
+                        <i class="icon-base ti tabler-books me-1_5 icon-sm"></i>Pendidikan & Pelatihan
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link" href="#" disabled data-bs-original-title="Sosial Ekonomi, isi profil terlebih dahulu" data-bs-toggle="tooltip" data-bs-placement="top">
-                          <i class="icon-base ti tabler-social me-1_5 icon-sm"></i>Sosial Ekonomi
+                        <i class="icon-base ti tabler-social me-1_5 icon-sm"></i>Sosial Ekonomi
                         </a>
                     </li>
                     <li class="nav-item">
@@ -344,42 +380,42 @@
                     </li>
                 </ul>
                 @else
-                <ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2">
+                <ul class="nav nav-pills flex-column flex-md-row mb-6 row-gap-2 nav-pills-custom-spacing">
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.edit') ? 'active' : '' }}" href="{{ route('petani.edit', $petani->id) }}">
-                            <i class="icon-base ti tabler-user-check me-1_5 icon-sm"></i>Profil
+                            <i class="icon-base ti tabler-user-check icon-sm"></i>Profil
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.lahan-tanaman.*') ? 'active' : '' }}" href="{{ route('petani.lahan-tanaman.index', $petani->id) }}">
-                          <i class="icon-base ti tabler-trees me-1_5 icon-sm"></i>Lahan & Tanaman
+                          <i class="icon-base ti tabler-trees icon-sm"></i>Lahan & Tanaman
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.praktik-budidaya.*') ? 'active' : '' }}" href="{{ route('petani.praktik-budidaya.index', $petani->id) }}">
-                          <i class="icon-base ti tabler-seedling me-1_5 icon-sm"></i>Praktik Budidaya
+                          <i class="icon-base ti tabler-seedling icon-sm"></i>Praktik Budidaya
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.pendidikan-pelatihan.*') ? 'active' : '' }}" href="{{ route('petani.pendidikan-pelatihan.index', $petani->id) }}">
-                          <i class="icon-base ti tabler-books me-1_5 icon-sm"></i>Pendidikan & Pelatihan
+                          <i class="icon-base ti tabler-books icon-sm"></i>Pendidikan & Pelatihan
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.sosial-ekonomi.*') ? 'active' : '' }}" href="{{ route('petani.sosial-ekonomi.index', $petani->id) }}">
-                          <i class="icon-base ti tabler-social me-1_5 icon-sm"></i>Sosial Ekonomi
+                          <i class="icon-base ti tabler-social icon-sm"></i>Sosial Ekonomi
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.akses-pasar.*') ? 'active' : '' }}" href="{{ route('petani.akses-pasar.index', $petani->id) }}">
-                            <i class="icon-base ti tabler-building-store me-1_5 icon-sm"></i>Akses Pasar
+                            <i class="icon-base ti tabler-building-store icon-sm"></i>Akses Pasar
                         </a>
                     </li>
                     <li class="nav-item">
                         <a class="nav-link {{ request()->routeIs('petani.skor.*') ? 'active' : '' }}" href="{{ route('petani.skor.index', $petani->id) }}">
-                            <i class="icon-base ti tabler-star me-1_5 icon-sm"></i>Kesiapan Adopsi
+                            <i class="icon-base ti tabler-star icon-sm"></i>Kesiapan Adopsi
                         </a>
                     </li>
                 </ul>
-                @endif  
+                @endif
             </div>