diff --git a/public/assets/css/custom.css b/public/assets/css/custom.css
index 2dfd38d..0c19d86 100644
--- a/public/assets/css/custom.css
+++ b/public/assets/css/custom.css
@@ -1,3 +1,11 @@
+.pageNumber{ list-style:none; padding:0px; margin: 0px;}
+    .pageNumber .page{ display: inline-block; padding: 10px;}
+    .pageNumber .page:hover,.resume:hover,.progress_usulan:hover{cursor: pointer!important;}
+    .page.active {
+        background-color: #007bff; /* Warna biru */
+        color: white;
+        font-weight: bold;
+    }
 .nav-tabs{
 	border-bottom: none;
 }
@@ -64,7 +72,7 @@
 /* Color */
 
 .page-content-wrapper{
-	background: #f9fafb!important;
+	background: #f3f4f6!important;
 }
 .border-none{
 	border:none;
@@ -86,7 +94,7 @@
 	color: #4b5563;
 }
 .nav-menu li > ul{
-	background-color:#EEEEEE;
+	background-color:#d1d5db;
 }
 .nav-menu li > ul li.active > a{
 	color: #4796f1;
diff --git a/resources/views/modules/kuesioner/form.blade.php b/resources/views/modules/kuesioner/form.blade.php
index 23a34de..55e21a9 100644
--- a/resources/views/modules/kuesioner/form.blade.php
+++ b/resources/views/modules/kuesioner/form.blade.php
@@ -2,36 +2,6 @@
 
 @section('page-css')
 <link rel="stylesheet" media="screen, print" href="{{asset('assets/css/datagrid/datatables/datatables.bundle.css')}}">
-<style type="text/css">
-    .listItem{
-        list-style: none;
-        margin: 0;
-        padding: 0;
-    }
-    .listItem > li{
-        display: inline-block;
-        margin: 10px;
-    }
-    .listItem > li:hover{
-        cursor: pointer;
-    }
-    .listItem > li .number{
-        font-size: 14px;
-        color: #fff;
-        background: #0ba360 !important;
-        padding: 10px;
-        border-radius: 10%;
-    }
-    .level{
-        float: right;
-        color: #fff;
-        text-align: center;
-        width: 100px;
-    }
-    .nav-link{
-        border-radius: 0px!important;
-    }
-</style>
 @endsection
 @section('content')
 <div class="row">
diff --git a/resources/views/modules/usulan/kriteria/form.blade.php b/resources/views/modules/usulan/kriteria/form.blade.php
index e0b1184..dfb0619 100644
--- a/resources/views/modules/usulan/kriteria/form.blade.php
+++ b/resources/views/modules/usulan/kriteria/form.blade.php
@@ -3,9 +3,6 @@
 @section('page-css')
 <link rel="stylesheet" media="screen, print" href="{{asset('assets/css/datagrid/datatables/datatables.bundle.css')}}">
 <link rel="stylesheet" href="{{asset('assets/css/formplugins/dropzone/dropzone.css')}}">
-<!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.css"> -->
-<!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/dropzone/5.9.3/min/dropzone.min.js"></script> -->
-
 <style type="text/css">
     .listItem{
         list-style: none;
@@ -35,30 +32,45 @@
     .nav-link{
         border-radius: 0px!important;
     }
-    .pageNumber{ list-style:none; padding:0px; margin: 0px;}
-    .pageNumber > li{ display: inline-block; padding: 12px; background: rgba(255, 255, 255, 0.5); margin: 5px 1px;}
-    .pageNumber > li:hover{cursor: pointer;}
-    .page.active {
-        background-color: #007bff; /* Warna biru */
-        color: white;
-        font-weight: bold;
-    }
-/*    #file-list{ margin: 0px; padding: 0px; width: 40%;}*/
-    #file-list > li{
-/*        padding: 10px;*/
-/*      border: 1px solid #ddd;*/
-/*      border-radius: 5px;*/
-/*      margin: 5px 0px;*/
-    }
+    
 </style>
 @endsection
 @section('content')
-<div class="subheader">
-    <h1 class="subheader-title">
-        <i class='subheader-icon fal fa-edit'></i> {{$title}}
-    </h1>
-</div>
+<form method="POST" id="form">
+        {{csrf_field()}}
+        <input type="hidden" name="secure_id" value="{{encode_id($kuesioner->KuesionerId)}}">
 <div class="row">
+    <div class="col-12 mb-3">
+        <div class="d-flex flex-row justify-content-between">
+            <div class="d-flex align-items-center">
+                <div class="subheader mb-0">
+                    <h1 class="subheader-title">
+                        {{$title}}
+                    </h1>
+                </div>
+            </div>
+            <div class="align-items-end">
+                <div class="card">
+                    <div class="card-body p-2">
+                        <div class="d-flex flex-row gap-3 justify-content-center align-items-center">
+                            <div class="p-2 bg-secondary rounded">
+                                <i class="fal fa-home"></i>
+                            </div>
+                            <div>
+                                <h5 class="fw-700 mb-1">{{session('name')}}</h5>
+                                <p class="mb-0">NPSN: {{session('npsn')}}</p>
+                            </div>
+                            <div class="d-flex flex-column gap-1">
+                                <span class="badge bg-primary-light text-primary">{{session('tingkat_sekolah')}}</span>
+                                <span class="badge bg-success-light text-success">{{session('status_sekolah')}}</span>
+                                <span class="badge bg-info-light text-info">Level {{levelAdiwiyata(session('npsn'))}}</span>
+                            </div>
+                        </div>  
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
     <div class="col-lg-12">
         @if ($errors->any())
             <div class="alert alert-danger">
@@ -69,77 +81,71 @@
                 </ul>
             </div>
         @endif
-        <form method="POST" id="form">
-        {{csrf_field()}}
-        <input type="hidden" name="secure_id" value="{{encode_id($kuesioner->KuesionerId)}}">
+    </div>
+    <div class="col-lg-12">
+        <div class="alert alert-warning">
+            <p class="mb-0"><i class="fal fa-info-circle"></i>&nbsp;Anda Belum Melakukan Finalisasi Proses Data Kriteria</p>
+            <p class="mb-0"><i class="fal fa-info-circle"></i>&nbsp;Klik <b class="text-danger">Progress Usulan</b> untuk melakukan Finalisasi Proses Data Kriteria</p>
+        </div>
+    </div>
+    
+        <div class="col-md-4">
             <div class="card">
                 <div class="card-body">
-                    <div class="row">
-                        <div class="col-md-12 p-3">
-                            <table class="" border="0" style="width:100%">
-                                <tr>
-                                    <td rowspan="5" width="5" style="vertical-align: middle; padding-right: 10px;">
-                                        <i class="fal fa-building fa-5x"></i>
-                                    </td>
-                                </tr>
-                                <tr>
-                                    <td colspan="2"><h5 class="text-success">NPSN: {{session('npsn')}}</h5></td>
-                                </tr>
-                                <tr>
-                                    <td colspan="2"><h4><b>{{session('name')}}</b></h4></td>
-                                </tr>
-                                <tr>
-                                    <td colspan="2"><span class="badge badge-primary">{{session('tingkat_sekolah')}}</span> <span class="badge badge-success">{{session('status_sekolah')}}</span></td>
-                                </tr>
-                                <tr>
-                                    <td colspan="2"><p>{{session('alamat_sekolah')}}</p></td>
-                                </tr>
-                            </table>
+                    <div class="pageNumber row gap-1 justify-content-center">
+                        @foreach($page as $hal)
+                        <div class="col-3 text-center page {{ (checkPenilaian($hal) == true ? 'bg-success text-white' : '' )}}" data-number={{$hal}}>
+                            <span>{{$hal}}</span>
                         </div>
-                        <div class="col-md-12">
-                            <div class="alert alert-warning">
-                                <p class="mb-0"><i class="fal fa-info-circle"></i>&nbsp;Anda Belum Melakukan Finalisasi Proses Data Kriteria</p>
-                                <p class="mb-0"><i class="fal fa-info-circle"></i>&nbsp;Klik <b class="text-danger">Progress Usulan</b> untuk melakukan Finalisasi Proses Data Kriteria</p>
-                            </div>
+                        @endforeach
+                    </div>
+                    <div class="row mt-2 gap-1 justify-content-center">
+                        <div class="col-5 text-center resume bg-secondary" style="padding: 10px;">
+                            <span>Resume</span>
                         </div>
-                        <div class="col-md-12" style="background: rgba(23, 162, 184, 0.2) !important;">
-                            <ul class="pageNumber">
-                                @foreach($page as $hal)
-                                <li class="page {{ (checkPenilaian($hal) == true ? 'bg-success text-white' : '' )}}" data-number={{$hal}}>{{$hal}}</li>
-                                @endforeach
-                                <li class="resume">Resume</li>
-                                <li class="progress_usulan">Progress Usulan</li>
-                            </ul>
+                        <div class="col-5 text-center progress_usulan  bg-secondary" style="padding: 10px;">
+                            <span>Progress Usulan</span>
                         </div>
-                        <div class="col-md-12 mt-3">
-                            <div class="alert alert-primary mb-2 p-2">
-                                <h6 class="mb-0"><b class="changeTitle">I. Perencanaan Gerakan PBLHS</b></h6>
-                            </div>
-                        </div>
-                        <div class="col-md-12 bodyInput">
-                            <div id="loading-spinner" style="display: none; text-align: center;">
-                                <img src="{{ asset('assets/spinner.gif') }}" alt="Loading..." width="20">
-                            </div>
-                            <div class="changeForm">
-                                {!! formKriteria(1) !!}
-                            </div>
-                        </div>
-                        
+                    </div>
+
+                    <ul class="pageNumber d-none">
+                        @foreach($page as $hal)
+                        <li class="page {{ (checkPenilaian($hal) == true ? 'bg-success text-white' : '' )}}" data-number={{$hal}}>{{$hal}}</li>
+                        @endforeach
+                        <li class="resume">Resume</li>
+                        <li class="progress_usulan">Progress Usulan</li>
+                    </ul>
+                </div>
+            </div>
+        </div>
+        <div class="col-md-8">
+            <div class="row">
+                <div class="col-md-12">
+                    <div class="alert alert-primary mb-2 p-2">
+                        <h6 class="mb-0"><b class="changeTitle">I. Perencanaan Gerakan PBLHS</b></h6>
                     </div>
                 </div>
-                <div class="card-footer">
+                <div class="col-md-12 bodyInput">
+                    <div id="loading-spinner" style="display: none; text-align: center;">
+                        <img src="{{ asset('assets/spinner.gif') }}" alt="Loading..." width="20">
+                    </div>
+                    <div class="changeForm">
+                        {!! formKriteria(1) !!}
+                    </div>
+                </div>
+                <div class="col-md-12">
                     @if(session('group_alias') == 'sekolah')
                         @if(($kuesioner->status == 1) || ($kuesioner->status == 5))
-                            <button id="btnSave" class="btn btn-success"><i class="fal fa-save"></i>&nbsp;Simpan Data</button>
+                            <div class="text-right">
+                                <button id="btnSave" class="btn btn-success"><i class="fal fa-save"></i>&nbsp;Simpan Data</button>
+                            </div>
                         @endif
                     @endif
                 </div>
-                
             </div>
-        </form>
-        
+        </div>
     </div>
-</div>
+</form>
 @endsection
 @section('page-js')
 <script type="text/javascript" src="{{asset('assets/js/formplugins/dropzone/dropzone.js')}}"></script>