From 17f5e2c11154e12266430b2597abfff590ecee19 Mon Sep 17 00:00:00 2001
From: Daeng Deni Mardaeni <ddeni05@gmail.com>
Date: Thu, 7 Sep 2023 23:33:13 +0700
Subject: [PATCH] initial commit

---
 Config/.gitkeep                             |    0
 Config/config.php                           |    5 +
 Console/.gitkeep                            |    0
 Database/Migrations/.gitkeep                |    0
 Database/Seeders/.gitkeep                   |    0
 Database/Seeders/FrontendDatabaseSeeder.php |   21 +
 Database/factories/.gitkeep                 |    0
 Entities/.gitkeep                           |    0
 Http/Controllers/.gitkeep                   |    0
 Http/Controllers/FrontendController.php     |  177 ++
 Http/Middleware/.gitkeep                    |    0
 Http/Requests/.gitkeep                      |    0
 Providers/.gitkeep                          |    0
 Providers/FrontendServiceProvider.php       |  114 +
 Providers/RouteServiceProvider.php          |   69 +
 Resources/assets/.gitkeep                   |    0
 Resources/assets/js/app.js                  |    0
 Resources/assets/output.css                 | 2394 +++++++++++++++++++
 Resources/assets/sass/app.scss              |    0
 Resources/lang/.gitkeep                     |    0
 Resources/views/.gitkeep                    |    0
 Resources/views/cakupan.blade.php           |  229 ++
 Resources/views/ci.blade.php                |   61 +
 Resources/views/consent.blade.php           |   61 +
 Resources/views/domain.blade.php            |   53 +
 Resources/views/facility.blade.php          |  210 ++
 Resources/views/ic.blade.php                |   61 +
 Resources/views/index.blade.php             |  367 +++
 Resources/views/kuisioner.blade.php         |   61 +
 Resources/views/layouts/master.blade.php    |   19 +
 Resources/views/peneliti.blade.php          |  241 ++
 Routes/.gitkeep                             |    0
 Routes/api.php                              |   18 +
 Routes/web.php                              |   27 +
 Tests/Feature/.gitkeep                      |    0
 Tests/Unit/.gitkeep                         |    0
 composer.json                               |   24 +
 module.json                                 |   11 +
 38 files changed, 4223 insertions(+)
 create mode 100644 Config/.gitkeep
 create mode 100644 Config/config.php
 create mode 100644 Console/.gitkeep
 create mode 100644 Database/Migrations/.gitkeep
 create mode 100644 Database/Seeders/.gitkeep
 create mode 100644 Database/Seeders/FrontendDatabaseSeeder.php
 create mode 100644 Database/factories/.gitkeep
 create mode 100644 Entities/.gitkeep
 create mode 100644 Http/Controllers/.gitkeep
 create mode 100644 Http/Controllers/FrontendController.php
 create mode 100644 Http/Middleware/.gitkeep
 create mode 100644 Http/Requests/.gitkeep
 create mode 100644 Providers/.gitkeep
 create mode 100644 Providers/FrontendServiceProvider.php
 create mode 100644 Providers/RouteServiceProvider.php
 create mode 100644 Resources/assets/.gitkeep
 create mode 100644 Resources/assets/js/app.js
 create mode 100644 Resources/assets/output.css
 create mode 100644 Resources/assets/sass/app.scss
 create mode 100644 Resources/lang/.gitkeep
 create mode 100644 Resources/views/.gitkeep
 create mode 100644 Resources/views/cakupan.blade.php
 create mode 100644 Resources/views/ci.blade.php
 create mode 100644 Resources/views/consent.blade.php
 create mode 100644 Resources/views/domain.blade.php
 create mode 100644 Resources/views/facility.blade.php
 create mode 100644 Resources/views/ic.blade.php
 create mode 100644 Resources/views/index.blade.php
 create mode 100644 Resources/views/kuisioner.blade.php
 create mode 100644 Resources/views/layouts/master.blade.php
 create mode 100644 Resources/views/peneliti.blade.php
 create mode 100644 Routes/.gitkeep
 create mode 100644 Routes/api.php
 create mode 100644 Routes/web.php
 create mode 100644 Tests/Feature/.gitkeep
 create mode 100644 Tests/Unit/.gitkeep
 create mode 100644 composer.json
 create mode 100644 module.json

diff --git a/Config/.gitkeep b/Config/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Config/config.php b/Config/config.php
new file mode 100644
index 0000000..f1bdf1b
--- /dev/null
+++ b/Config/config.php
@@ -0,0 +1,5 @@
+<?php
+
+return [
+    'name' => 'Frontend'
+];
diff --git a/Console/.gitkeep b/Console/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Database/Migrations/.gitkeep b/Database/Migrations/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Database/Seeders/.gitkeep b/Database/Seeders/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Database/Seeders/FrontendDatabaseSeeder.php b/Database/Seeders/FrontendDatabaseSeeder.php
new file mode 100644
index 0000000..1c67380
--- /dev/null
+++ b/Database/Seeders/FrontendDatabaseSeeder.php
@@ -0,0 +1,21 @@
+<?php
+
+namespace Modules\Frontend\Database\Seeders;
+
+use Illuminate\Database\Seeder;
+use Illuminate\Database\Eloquent\Model;
+
+class FrontendDatabaseSeeder extends Seeder
+{
+    /**
+     * Run the database seeds.
+     *
+     * @return void
+     */
+    public function run()
+    {
+        Model::unguard();
+
+        // $this->call("OthersTableSeeder");
+    }
+}
diff --git a/Database/factories/.gitkeep b/Database/factories/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Entities/.gitkeep b/Entities/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Http/Controllers/.gitkeep b/Http/Controllers/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Http/Controllers/FrontendController.php b/Http/Controllers/FrontendController.php
new file mode 100644
index 0000000..6ee458f
--- /dev/null
+++ b/Http/Controllers/FrontendController.php
@@ -0,0 +1,177 @@
+<?php
+
+namespace Modules\Frontend\Http\Controllers;
+
+use Carbon\Carbon;
+use Illuminate\Contracts\Support\Renderable;
+use Illuminate\Http\Request;
+use Illuminate\Routing\Controller;
+use Illuminate\Support\Collection;
+use Illuminate\Support\Facades\File;
+use Illuminate\Support\Facades\Http;
+use Illuminate\Support\Facades\Storage;
+use Revolution\Google\Sheets\Facades\Sheets;
+
+class FrontendController extends Controller
+{
+    /**
+     * Display a listing of the resource.
+     * @return Renderable
+     */
+    public function index()
+    {
+        $json = File::get('storage/kurs.json');
+        $kurs = json_decode($json);
+        if($kurs->date != date('Y-m-d')){
+            $this->getKurs();
+        }
+
+        $json = File::get('storage/kurs.json');
+        $kurs = json_decode($json);
+        $usd = $kurs->rates->IDR/$kurs->rates->USD;
+        $date = Carbon::createFromTimestamp($kurs->timestamp)->locale('id')->setTimezone('Asia/Jakarta')->translatedFormat('d F Y H:i:s');
+
+        $sheets = Sheets::spreadsheet('1c2Uv3QVTyLzsJPE4uqqlMGNKO8z0Kqj6aEGh0uixAqA')->sheet('Platform')->range('A:F')->get();
+        $header = $sheets->pull(0);
+        $posts  = Sheets::collection($header, $sheets);
+        $posts  = $posts->take(5000);
+        $data = new Collection($posts->toArray());
+        $platform = $data->random(5);
+
+        return view('frontend::index', compact('kurs', 'usd','date','platform'));
+    }
+
+    public function cakupan()
+    {
+
+        $json = File::get('storage/kurs.json');
+        $kurs = json_decode($json);
+        if($kurs->date != date('Y-m-d')){
+            $this->getKurs();
+        }
+
+        $json = File::get('storage/kurs.json');
+        $kurs = json_decode($json);
+        $usd = $kurs->rates->IDR/$kurs->rates->USD;
+        $date = Carbon::createFromTimestamp($kurs->timestamp)->locale('id')->setTimezone('Asia/Jakarta')->translatedFormat('d F Y H:i:s');
+
+        $sheets = Sheets::spreadsheet('1c2Uv3QVTyLzsJPE4uqqlMGNKO8z0Kqj6aEGh0uixAqA')->sheet('Platform')->range('A:F')->get();
+        $header = $sheets->pull(0);
+        $posts  = Sheets::collection($header, $sheets);
+        $data = new Collection($posts->toArray());
+
+        return view('frontend::cakupan', compact('kurs', 'usd','date','data'));
+    }
+
+    public function peneliti()
+    {
+        $sheets = Sheets::spreadsheet('1kM32QnxjRDpH1WkFSfOwMuTKzoCQpXFDYhekARcypjY')->sheet('Research Proposal')->range('A:K')->get();
+        $header = $sheets->pull(0);
+        $posts  = Sheets::collection($header, $sheets);
+        $posts  = $posts->take(5000);
+
+        $data = $posts->toArray();
+
+        $researcher = [];
+        $no         = 1;
+        if ($data) {
+            foreach ($data as $key => $value) {
+                if ($data[$key]['Researchers Name'] != null) {
+                    $output['no']                = $no++;
+                    $output['id']                = $data[$key]['ID'];
+                    $output['reseracher_name']   = $data[$key]['Researchers Name'];
+                    $output['region']            = $data[$key]['Region'];
+                    $output['institution']       = $data[$key]['Institution'];
+                    $output['research_title']    = $data[$key]['Research Title'];
+                    $output['email']             = $data[$key]['Email'];
+                    $output['registration_date'] = $data[$key]['Registration Date'];
+
+                    $researcher[] = $output;
+                }
+            }
+        } else {
+            $researcher = [];
+        }
+
+        return view('frontend::peneliti', compact('researcher'));
+    }
+
+    public function facility()
+    {
+        $sheets = Sheets::spreadsheet('1kM32QnxjRDpH1WkFSfOwMuTKzoCQpXFDYhekARcypjY')->sheet('Sequencing Facility')->get();
+        $header = $sheets->pull(0);
+        $posts  = Sheets::collection($header, $sheets);
+        $posts  = $posts->take(5000);
+
+        $data = $posts->toArray();
+
+        $facility = [];
+        $no         = 1;
+        if ($data) {
+            foreach ($data as $key => $value) {
+                if ($data[$key]['Facility Name'] != null) {
+                    $output['no']            = $no++;
+                    $output['facility_name'] = $data[$key]['Facility Name'];
+                    $output['institution']   = $data[$key]['Institution'];
+                    $output['address']       = $data[$key]['Address'];
+                    $output['region']        = $data[$key]['Region'];
+
+                    $facility[] = $output;
+                }
+            }
+        } else {
+            $facility = [];
+        }
+
+        return view('frontend::facility', compact('facility'));
+    }
+
+    public function hibah()
+    {
+        return view('frontend::hibah');
+    }
+
+    public function kuisioner()
+    {
+        return view('frontend::kuisioner');
+    }
+
+    public function consent()
+    {
+        return view('frontend::consent');
+    }
+
+    public function silx_ci()
+    {
+        return view('frontend::ci');
+    }
+    public function silx_ic()
+    {
+        return view('frontend::ic');
+    }
+
+    public function getKurs(){
+        $response = Http::get('http://api.exchangeratesapi.io/v1/latest?access_key=9f7cd7db5b72280a93c8e15243fadab7&symbols=USD,IDR');
+        $data = $response->json();
+        Storage::disk('public')->put('kurs.json', json_encode($data));
+    }
+
+    public function domain(Request $request)
+    {
+
+        if (isset($request->search)) {
+            $domain   = $request->search;
+            $response = Http::asForm()->POST('https://srb1975.srs-x.com/api/domain/check', [
+                'username' => "qnwa882l",
+                'password' => "cdae44fd320c033dcd69718b217cdcc6fd51b8476d739e3d8b1c3a1fa5366395",
+                'domain'   => $domain,
+            ]);
+
+            $data = simplexml_load_string($response->body());
+            $data = $data->result;
+            return view('frontend::domain', compact('data'));
+        } else {
+            return view('frontend::domain');
+        }
+    }
+}
diff --git a/Http/Middleware/.gitkeep b/Http/Middleware/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Http/Requests/.gitkeep b/Http/Requests/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Providers/.gitkeep b/Providers/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Providers/FrontendServiceProvider.php b/Providers/FrontendServiceProvider.php
new file mode 100644
index 0000000..c26b6dc
--- /dev/null
+++ b/Providers/FrontendServiceProvider.php
@@ -0,0 +1,114 @@
+<?php
+
+namespace Modules\Frontend\Providers;
+
+use Illuminate\Support\ServiceProvider;
+use Illuminate\Database\Eloquent\Factory;
+
+class FrontendServiceProvider extends ServiceProvider
+{
+    /**
+     * @var string $moduleName
+     */
+    protected $moduleName = 'Frontend';
+
+    /**
+     * @var string $moduleNameLower
+     */
+    protected $moduleNameLower = 'frontend';
+
+    /**
+     * Boot the application events.
+     *
+     * @return void
+     */
+    public function boot()
+    {
+        $this->registerTranslations();
+        $this->registerConfig();
+        $this->registerViews();
+        $this->loadMigrationsFrom(module_path($this->moduleName, 'Database/Migrations'));
+    }
+
+    /**
+     * Register the service provider.
+     *
+     * @return void
+     */
+    public function register()
+    {
+        $this->app->register(RouteServiceProvider::class);
+    }
+
+    /**
+     * Register config.
+     *
+     * @return void
+     */
+    protected function registerConfig()
+    {
+        $this->publishes([
+            module_path($this->moduleName, 'Config/config.php') => config_path($this->moduleNameLower . '.php'),
+        ], 'config');
+        $this->mergeConfigFrom(
+            module_path($this->moduleName, 'Config/config.php'), $this->moduleNameLower
+        );
+    }
+
+    /**
+     * Register views.
+     *
+     * @return void
+     */
+    public function registerViews()
+    {
+        $viewPath = resource_path('views/modules/' . $this->moduleNameLower);
+
+        $sourcePath = module_path($this->moduleName, 'Resources/views');
+
+        $this->publishes([
+            $sourcePath => $viewPath
+        ], ['views', $this->moduleNameLower . '-module-views']);
+
+        $this->loadViewsFrom(array_merge($this->getPublishableViewPaths(), [$sourcePath]), $this->moduleNameLower);
+    }
+
+    /**
+     * Register translations.
+     *
+     * @return void
+     */
+    public function registerTranslations()
+    {
+        $langPath = resource_path('lang/modules/' . $this->moduleNameLower);
+
+        if (is_dir($langPath)) {
+            $this->loadTranslationsFrom($langPath, $this->moduleNameLower);
+            $this->loadJsonTranslationsFrom($langPath);
+        } else {
+            $this->loadTranslationsFrom(module_path($this->moduleName, 'Resources/lang'), $this->moduleNameLower);
+            $this->loadJsonTranslationsFrom(module_path($this->moduleName, 'Resources/lang'));
+        }
+    }
+
+    /**
+     * Get the services provided by the provider.
+     *
+     * @return array
+     */
+    public function provides()
+    {
+        return [];
+    }
+
+    private function getPublishableViewPaths(): array
+    {
+        $paths = [];
+        foreach (\Config::get('view.paths') as $path) {
+            if (is_dir($path . '/modules/' . $this->moduleNameLower)) {
+                $paths[] = $path . '/modules/' . $this->moduleNameLower;
+            }
+        }
+        return $paths;
+    }
+}
diff --git a/Providers/RouteServiceProvider.php b/Providers/RouteServiceProvider.php
new file mode 100644
index 0000000..55ac64a
--- /dev/null
+++ b/Providers/RouteServiceProvider.php
@@ -0,0 +1,69 @@
+<?php
+
+namespace Modules\Frontend\Providers;
+
+use Illuminate\Support\Facades\Route;
+use Illuminate\Foundation\Support\Providers\RouteServiceProvider as ServiceProvider;
+
+class RouteServiceProvider extends ServiceProvider
+{
+    /**
+     * The module namespace to assume when generating URLs to actions.
+     *
+     * @var string
+     */
+    protected $moduleNamespace = 'Modules\Frontend\Http\Controllers';
+
+    /**
+     * Called before routes are registered.
+     *
+     * Register any model bindings or pattern based filters.
+     *
+     * @return void
+     */
+    public function boot()
+    {
+        parent::boot();
+    }
+
+    /**
+     * Define the routes for the application.
+     *
+     * @return void
+     */
+    public function map()
+    {
+        $this->mapApiRoutes();
+
+        $this->mapWebRoutes();
+    }
+
+    /**
+     * Define the "web" routes for the application.
+     *
+     * These routes all receive session state, CSRF protection, etc.
+     *
+     * @return void
+     */
+    protected function mapWebRoutes()
+    {
+        Route::middleware('web')
+            ->namespace($this->moduleNamespace)
+            ->group(module_path('Frontend', '/Routes/web.php'));
+    }
+
+    /**
+     * Define the "api" routes for the application.
+     *
+     * These routes are typically stateless.
+     *
+     * @return void
+     */
+    protected function mapApiRoutes()
+    {
+        Route::prefix('api')
+            ->middleware('api')
+            ->namespace($this->moduleNamespace)
+            ->group(module_path('Frontend', '/Routes/api.php'));
+    }
+}
diff --git a/Resources/assets/.gitkeep b/Resources/assets/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Resources/assets/js/app.js b/Resources/assets/js/app.js
new file mode 100644
index 0000000..e69de29
diff --git a/Resources/assets/output.css b/Resources/assets/output.css
new file mode 100644
index 0000000..b5b6c16
--- /dev/null
+++ b/Resources/assets/output.css
@@ -0,0 +1,2394 @@
+/*
+! tailwindcss v3.3.3 | MIT License | https://tailwindcss.com
+*/
+
+/*
+1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
+2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
+*/
+
+*,
+::before,
+::after {
+  box-sizing: border-box;
+  /* 1 */
+  border-width: 0;
+  /* 2 */
+  border-style: solid;
+  /* 2 */
+  border-color: #E5E7EB;
+  /* 2 */
+}
+
+::before,
+::after {
+  --tw-content: '';
+}
+
+/*
+1. Use a consistent sensible line-height in all browsers.
+2. Prevent adjustments of font size after orientation changes in iOS.
+3. Use a more readable tab size.
+4. Use the user's configured `sans` font-family by default.
+5. Use the user's configured `sans` font-feature-settings by default.
+6. Use the user's configured `sans` font-variation-settings by default.
+*/
+
+html {
+  line-height: 1.5;
+  /* 1 */
+  -webkit-text-size-adjust: 100%;
+  /* 2 */
+  -moz-tab-size: 4;
+  /* 3 */
+  -o-tab-size: 4;
+     tab-size: 4;
+  /* 3 */
+  font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  /* 4 */
+  font-feature-settings: normal;
+  /* 5 */
+  font-variation-settings: normal;
+  /* 6 */
+}
+
+/*
+1. Remove the margin in all browsers.
+2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
+*/
+
+body {
+  margin: 0;
+  /* 1 */
+  line-height: inherit;
+  /* 2 */
+}
+
+/*
+1. Add the correct height in Firefox.
+2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
+3. Ensure horizontal rules are visible by default.
+*/
+
+hr {
+  height: 0;
+  /* 1 */
+  color: inherit;
+  /* 2 */
+  border-top-width: 1px;
+  /* 3 */
+}
+
+/*
+Add the correct text decoration in Chrome, Edge, and Safari.
+*/
+
+abbr:where([title]) {
+  -webkit-text-decoration: underline dotted;
+          text-decoration: underline dotted;
+}
+
+/*
+Remove the default font size and weight for headings.
+*/
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-size: inherit;
+  font-weight: inherit;
+}
+
+/*
+Reset links to optimize for opt-in styling instead of opt-out.
+*/
+
+a {
+  color: inherit;
+  text-decoration: inherit;
+}
+
+/*
+Add the correct font weight in Edge and Safari.
+*/
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+/*
+1. Use the user's configured `mono` font family by default.
+2. Correct the odd `em` font sizing in all browsers.
+*/
+
+code,
+kbd,
+samp,
+pre {
+  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  /* 1 */
+  font-size: 1em;
+  /* 2 */
+}
+
+/*
+Add the correct font size in all browsers.
+*/
+
+small {
+  font-size: 80%;
+}
+
+/*
+Prevent `sub` and `sup` elements from affecting the line height in all browsers.
+*/
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+/*
+1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
+2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
+3. Remove gaps between table borders by default.
+*/
+
+table {
+  text-indent: 0;
+  /* 1 */
+  border-color: inherit;
+  /* 2 */
+  border-collapse: collapse;
+  /* 3 */
+}
+
+/*
+1. Change the font styles in all browsers.
+2. Remove the margin in Firefox and Safari.
+3. Remove default padding in all browsers.
+*/
+
+button,
+input,
+optgroup,
+select,
+textarea {
+  font-family: inherit;
+  /* 1 */
+  font-feature-settings: inherit;
+  /* 1 */
+  font-variation-settings: inherit;
+  /* 1 */
+  font-size: 100%;
+  /* 1 */
+  font-weight: inherit;
+  /* 1 */
+  line-height: inherit;
+  /* 1 */
+  color: inherit;
+  /* 1 */
+  margin: 0;
+  /* 2 */
+  padding: 0;
+  /* 3 */
+}
+
+/*
+Remove the inheritance of text transform in Edge and Firefox.
+*/
+
+button,
+select {
+  text-transform: none;
+}
+
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Remove default button styles.
+*/
+
+button,
+[type='button'],
+[type='reset'],
+[type='submit'] {
+  -webkit-appearance: button;
+  /* 1 */
+  background-color: transparent;
+  /* 2 */
+  background-image: none;
+  /* 2 */
+}
+
+/*
+Use the modern Firefox focus style for all focusable elements.
+*/
+
+:-moz-focusring {
+  outline: auto;
+}
+
+/*
+Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
+*/
+
+:-moz-ui-invalid {
+  box-shadow: none;
+}
+
+/*
+Add the correct vertical alignment in Chrome and Firefox.
+*/
+
+progress {
+  vertical-align: baseline;
+}
+
+/*
+Correct the cursor style of increment and decrement buttons in Safari.
+*/
+
+::-webkit-inner-spin-button,
+::-webkit-outer-spin-button {
+  height: auto;
+}
+
+/*
+1. Correct the odd appearance in Chrome and Safari.
+2. Correct the outline style in Safari.
+*/
+
+[type='search'] {
+  -webkit-appearance: textfield;
+  /* 1 */
+  outline-offset: -2px;
+  /* 2 */
+}
+
+/*
+Remove the inner padding in Chrome and Safari on macOS.
+*/
+
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+/*
+1. Correct the inability to style clickable types in iOS and Safari.
+2. Change font properties to `inherit` in Safari.
+*/
+
+::-webkit-file-upload-button {
+  -webkit-appearance: button;
+  /* 1 */
+  font: inherit;
+  /* 2 */
+}
+
+/*
+Add the correct display in Chrome and Safari.
+*/
+
+summary {
+  display: list-item;
+}
+
+/*
+Removes the default spacing and border for appropriate elements.
+*/
+
+blockquote,
+dl,
+dd,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+hr,
+figure,
+p,
+pre {
+  margin: 0;
+}
+
+fieldset {
+  margin: 0;
+  padding: 0;
+}
+
+legend {
+  padding: 0;
+}
+
+ol,
+ul,
+menu {
+  list-style: none;
+  margin: 0;
+  padding: 0;
+}
+
+/*
+Reset default styling for dialogs.
+*/
+
+dialog {
+  padding: 0;
+}
+
+/*
+Prevent resizing textareas horizontally by default.
+*/
+
+textarea {
+  resize: vertical;
+}
+
+/*
+1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
+2. Set the default placeholder color to the user's configured gray 400 color.
+*/
+
+input::-moz-placeholder, textarea::-moz-placeholder {
+  opacity: 1;
+  /* 1 */
+  color: #9CA3AF;
+  /* 2 */
+}
+
+input::placeholder,
+textarea::placeholder {
+  opacity: 1;
+  /* 1 */
+  color: #9CA3AF;
+  /* 2 */
+}
+
+/*
+Set the default cursor for buttons.
+*/
+
+button,
+[role="button"] {
+  cursor: pointer;
+}
+
+/*
+Make sure disabled buttons don't get the pointer cursor.
+*/
+
+:disabled {
+  cursor: default;
+}
+
+/*
+1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
+2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
+   This can trigger a poorly considered lint error in some tools but is included by design.
+*/
+
+img,
+svg,
+video,
+canvas,
+audio,
+iframe,
+embed,
+object {
+  display: block;
+  /* 1 */
+  vertical-align: middle;
+  /* 2 */
+}
+
+/*
+Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
+*/
+
+img,
+video {
+  max-width: 100%;
+  height: auto;
+}
+
+/* Make elements with the HTML hidden attribute stay hidden by default */
+
+[hidden] {
+  display: none;
+}
+
+[type='text'],[type='email'],[type='url'],[type='password'],[type='number'],[type='date'],[type='datetime-local'],[type='month'],[type='search'],[type='tel'],[type='time'],[type='week'],[multiple],textarea,select {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  background-color: #fff;
+  border-color: #6B7280;
+  border-width: 1px;
+  border-radius: 0px;
+  padding-top: 0.5rem;
+  padding-right: 0.75rem;
+  padding-bottom: 0.5rem;
+  padding-left: 0.75rem;
+  font-size: 1rem;
+  line-height: 1.5rem;
+  --tw-shadow: 0 0 #0000;
+}
+
+[type='text']:focus, [type='email']:focus, [type='url']:focus, [type='password']:focus, [type='number']:focus, [type='date']:focus, [type='datetime-local']:focus, [type='month']:focus, [type='search']:focus, [type='tel']:focus, [type='time']:focus, [type='week']:focus, [multiple]:focus, textarea:focus, select:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: #1C64F2;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+  border-color: #1C64F2;
+}
+
+input::-moz-placeholder, textarea::-moz-placeholder {
+  color: #6B7280;
+  opacity: 1;
+}
+
+input::placeholder,textarea::placeholder {
+  color: #6B7280;
+  opacity: 1;
+}
+
+::-webkit-datetime-edit-fields-wrapper {
+  padding: 0;
+}
+
+::-webkit-date-and-time-value {
+  min-height: 1.5em;
+}
+
+select {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236B7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
+  background-position: right 0.5rem center;
+  background-repeat: no-repeat;
+  background-size: 1.5em 1.5em;
+  padding-right: 2.5rem;
+  -webkit-print-color-adjust: exact;
+          print-color-adjust: exact;
+}
+
+[multiple] {
+  background-image: initial;
+  background-position: initial;
+  background-repeat: unset;
+  background-size: initial;
+  padding-right: 0.75rem;
+  -webkit-print-color-adjust: unset;
+          print-color-adjust: unset;
+}
+
+[type='checkbox'],[type='radio'] {
+  -webkit-appearance: none;
+     -moz-appearance: none;
+          appearance: none;
+  padding: 0;
+  -webkit-print-color-adjust: exact;
+          print-color-adjust: exact;
+  display: inline-block;
+  vertical-align: middle;
+  background-origin: border-box;
+  -webkit-user-select: none;
+     -moz-user-select: none;
+          user-select: none;
+  flex-shrink: 0;
+  height: 1rem;
+  width: 1rem;
+  color: #1C64F2;
+  background-color: #fff;
+  border-color: #6B7280;
+  border-width: 1px;
+  --tw-shadow: 0 0 #0000;
+}
+
+[type='checkbox'] {
+  border-radius: 0px;
+}
+
+[type='radio'] {
+  border-radius: 100%;
+}
+
+[type='checkbox']:focus,[type='radio']:focus {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  --tw-ring-inset: var(--tw-empty,/*!*/ /*!*/);
+  --tw-ring-offset-width: 2px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: #1C64F2;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
+}
+
+[type='checkbox']:checked,[type='radio']:checked,.dark [type='checkbox']:checked,.dark [type='radio']:checked {
+  border-color: transparent;
+  background-color: currentColor;
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+[type='checkbox']:checked {
+  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
+}
+
+[type='radio']:checked {
+  background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
+}
+
+[type='checkbox']:indeterminate {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");
+  border-color: transparent;
+  background-color: currentColor;
+  background-size: 100% 100%;
+  background-position: center;
+  background-repeat: no-repeat;
+}
+
+[type='checkbox']:indeterminate:hover,[type='checkbox']:indeterminate:focus {
+  border-color: transparent;
+  background-color: currentColor;
+}
+
+[type='file'] {
+  background: unset;
+  border-color: inherit;
+  border-width: 0;
+  border-radius: 0;
+  padding: 0;
+  font-size: unset;
+  line-height: inherit;
+}
+
+[type='file']:focus {
+  outline: 1px auto inherit;
+}
+
+input[type=file]::file-selector-button {
+  color: white;
+  background: #1F2937;
+  border: 0;
+  font-weight: 500;
+  font-size: 0.875rem;
+  cursor: pointer;
+  padding-top: 0.625rem;
+  padding-bottom: 0.625rem;
+  padding-left: 2rem;
+  padding-right: 1rem;
+  -webkit-margin-start: -1rem;
+          margin-inline-start: -1rem;
+  -webkit-margin-end: 1rem;
+          margin-inline-end: 1rem;
+}
+
+input[type=file]::file-selector-button:hover {
+  background: #374151;
+}
+
+.dark input[type=file]::file-selector-button {
+  color: white;
+  background: #4B5563;
+}
+
+.dark input[type=file]::file-selector-button:hover {
+  background: #6B7280;
+}
+
+input[type="range"]::-webkit-slider-thumb {
+  height: 1.25rem;
+  width: 1.25rem;
+  background: #1C64F2;
+  border-radius: 9999px;
+  border: 0;
+  appearance: none;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  cursor: pointer;
+}
+
+input[type="range"]:disabled::-webkit-slider-thumb {
+  background: #9CA3AF;
+}
+
+.dark input[type="range"]:disabled::-webkit-slider-thumb {
+  background: #6B7280;
+}
+
+input[type="range"]:focus::-webkit-slider-thumb {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+  --tw-ring-opacity: 1px;
+  --tw-ring-color: rgb(164 202 254 / var(--tw-ring-opacity));
+}
+
+input[type="range"]::-moz-range-thumb {
+  height: 1.25rem;
+  width: 1.25rem;
+  background: #1C64F2;
+  border-radius: 9999px;
+  border: 0;
+  appearance: none;
+  -moz-appearance: none;
+  -webkit-appearance: none;
+  cursor: pointer;
+}
+
+input[type="range"]:disabled::-moz-range-thumb {
+  background: #9CA3AF;
+}
+
+.dark input[type="range"]:disabled::-moz-range-thumb {
+  background: #6B7280;
+}
+
+input[type="range"]::-moz-range-progress {
+  background: #3F83F8;
+}
+
+input[type="range"]::-ms-fill-lower {
+  background: #3F83F8;
+}
+
+.toggle-bg:after {
+  content: "";
+  position: absolute;
+  top: 0.125rem;
+  left: 0.125rem;
+  background: white;
+  border-color: #D1D5DB;
+  border-width: 1px;
+  border-radius: 9999px;
+  height: 1.25rem;
+  width: 1.25rem;
+  transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;
+  transition-duration: .15s;
+  box-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+}
+
+input:checked + .toggle-bg:after {
+  transform: translateX(100%);;
+  border-color: white;
+}
+
+input:checked + .toggle-bg {
+  background: #1C64F2;
+  border-color: #1C64F2;
+}
+
+.tooltip-arrow,.tooltip-arrow:before {
+  position: absolute;
+  width: 8px;
+  height: 8px;
+  background: inherit;
+}
+
+.tooltip-arrow {
+  visibility: hidden;
+}
+
+.tooltip-arrow:before {
+  content: "";
+  visibility: visible;
+  transform: rotate(45deg);
+}
+
+[data-tooltip-style^='light'] + .tooltip > .tooltip-arrow:before {
+  border-style: solid;
+  border-color: #e5e7eb;
+}
+
+[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='top'] > .tooltip-arrow:before {
+  border-bottom-width: 1px;
+  border-right-width: 1px;
+}
+
+[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='right'] > .tooltip-arrow:before {
+  border-bottom-width: 1px;
+  border-left-width: 1px;
+}
+
+[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='bottom'] > .tooltip-arrow:before {
+  border-top-width: 1px;
+  border-left-width: 1px;
+}
+
+[data-tooltip-style^='light'] + .tooltip[data-popper-placement^='left'] > .tooltip-arrow:before {
+  border-top-width: 1px;
+  border-right-width: 1px;
+}
+
+.tooltip[data-popper-placement^='top'] > .tooltip-arrow {
+  bottom: -4px;
+}
+
+.tooltip[data-popper-placement^='bottom'] > .tooltip-arrow {
+  top: -4px;
+}
+
+.tooltip[data-popper-placement^='left'] > .tooltip-arrow {
+  right: -4px;
+}
+
+.tooltip[data-popper-placement^='right'] > .tooltip-arrow {
+  left: -4px;
+}
+
+.tooltip.invisible > .tooltip-arrow:before {
+  visibility: hidden;
+}
+
+*, ::before, ::after {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(63 131 248 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+
+::backdrop {
+  --tw-border-spacing-x: 0;
+  --tw-border-spacing-y: 0;
+  --tw-translate-x: 0;
+  --tw-translate-y: 0;
+  --tw-rotate: 0;
+  --tw-skew-x: 0;
+  --tw-skew-y: 0;
+  --tw-scale-x: 1;
+  --tw-scale-y: 1;
+  --tw-pan-x:  ;
+  --tw-pan-y:  ;
+  --tw-pinch-zoom:  ;
+  --tw-scroll-snap-strictness: proximity;
+  --tw-gradient-from-position:  ;
+  --tw-gradient-via-position:  ;
+  --tw-gradient-to-position:  ;
+  --tw-ordinal:  ;
+  --tw-slashed-zero:  ;
+  --tw-numeric-figure:  ;
+  --tw-numeric-spacing:  ;
+  --tw-numeric-fraction:  ;
+  --tw-ring-inset:  ;
+  --tw-ring-offset-width: 0px;
+  --tw-ring-offset-color: #fff;
+  --tw-ring-color: rgb(63 131 248 / 0.5);
+  --tw-ring-offset-shadow: 0 0 #0000;
+  --tw-ring-shadow: 0 0 #0000;
+  --tw-shadow: 0 0 #0000;
+  --tw-shadow-colored: 0 0 #0000;
+  --tw-blur:  ;
+  --tw-brightness:  ;
+  --tw-contrast:  ;
+  --tw-grayscale:  ;
+  --tw-hue-rotate:  ;
+  --tw-invert:  ;
+  --tw-saturate:  ;
+  --tw-sepia:  ;
+  --tw-drop-shadow:  ;
+  --tw-backdrop-blur:  ;
+  --tw-backdrop-brightness:  ;
+  --tw-backdrop-contrast:  ;
+  --tw-backdrop-grayscale:  ;
+  --tw-backdrop-hue-rotate:  ;
+  --tw-backdrop-invert:  ;
+  --tw-backdrop-opacity:  ;
+  --tw-backdrop-saturate:  ;
+  --tw-backdrop-sepia:  ;
+}
+
+.container {
+  width: 100%;
+}
+
+@media (min-width: 640px) {
+  .container {
+    max-width: 640px;
+  }
+}
+
+@media (min-width: 768px) {
+  .container {
+    max-width: 768px;
+  }
+}
+
+@media (min-width: 1024px) {
+  .container {
+    max-width: 1024px;
+  }
+}
+
+@media (min-width: 1280px) {
+  .container {
+    max-width: 1280px;
+  }
+}
+
+@media (min-width: 1536px) {
+  .container {
+    max-width: 1536px;
+  }
+}
+
+.sr-only {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border-width: 0 !important;
+}
+
+.visible {
+  visibility: visible !important;
+}
+
+.invisible {
+  visibility: hidden !important;
+}
+
+.collapse {
+  visibility: collapse !important;
+}
+
+.static {
+  position: static !important;
+}
+
+.fixed {
+  position: fixed !important;
+}
+
+.absolute {
+  position: absolute !important;
+}
+
+.relative {
+  position: relative !important;
+}
+
+.inset-0 {
+  inset: 0px !important;
+}
+
+.inset-x-0 {
+  left: 0px !important;
+  right: 0px !important;
+}
+
+.-left-1 {
+  left: -0.25rem !important;
+}
+
+.-left-1\.5 {
+  left: -0.375rem !important;
+}
+
+.bottom-0 {
+  bottom: 0px !important;
+}
+
+.left-0 {
+  left: 0px !important;
+}
+
+.top-0 {
+  top: 0px !important;
+}
+
+.z-10 {
+  z-index: 10 !important;
+}
+
+.z-20 {
+  z-index: 20 !important;
+}
+
+.z-40 {
+  z-index: 40 !important;
+}
+
+.col-span-2 {
+  grid-column: span 2 / span 2 !important;
+}
+
+.mx-auto {
+  margin-left: auto !important;
+  margin-right: auto !important;
+}
+
+.my-6 {
+  margin-top: 1.5rem !important;
+  margin-bottom: 1.5rem !important;
+}
+
+.my-7 {
+  margin-top: 1.75rem !important;
+  margin-bottom: 1.75rem !important;
+}
+
+.mb-1 {
+  margin-bottom: 0.25rem !important;
+}
+
+.mb-10 {
+  margin-bottom: 2.5rem !important;
+}
+
+.mb-2 {
+  margin-bottom: 0.5rem !important;
+}
+
+.mb-3 {
+  margin-bottom: 0.75rem !important;
+}
+
+.mb-4 {
+  margin-bottom: 1rem !important;
+}
+
+.mb-6 {
+  margin-bottom: 1.5rem !important;
+}
+
+.mb-8 {
+  margin-bottom: 2rem !important;
+}
+
+.ml-1 {
+  margin-left: 0.25rem !important;
+}
+
+.ml-3 {
+  margin-left: 0.75rem !important;
+}
+
+.ml-4 {
+  margin-left: 1rem !important;
+}
+
+.mr-3 {
+  margin-right: 0.75rem !important;
+}
+
+.mr-auto {
+  margin-right: auto !important;
+}
+
+.mt-1 {
+  margin-top: 0.25rem !important;
+}
+
+.mt-1\.5 {
+  margin-top: 0.375rem !important;
+}
+
+.mt-10 {
+  margin-top: 2.5rem !important;
+}
+
+.mt-2 {
+  margin-top: 0.5rem !important;
+}
+
+.mt-3 {
+  margin-top: 0.75rem !important;
+}
+
+.mt-4 {
+  margin-top: 1rem !important;
+}
+
+.mt-5 {
+  margin-top: 1.25rem !important;
+}
+
+.mt-6 {
+  margin-top: 1.5rem !important;
+}
+
+.block {
+  display: block !important;
+}
+
+.inline-block {
+  display: inline-block !important;
+}
+
+.inline {
+  display: inline !important;
+}
+
+.flex {
+  display: flex !important;
+}
+
+.inline-flex {
+  display: inline-flex !important;
+}
+
+.table {
+  display: table !important;
+}
+
+.grid {
+  display: grid !important;
+}
+
+.hidden {
+  display: none !important;
+}
+
+.h-12 {
+  height: 3rem !important;
+}
+
+.h-16 {
+  height: 4rem !important;
+}
+
+.h-2 {
+  height: 0.5rem !important;
+}
+
+.h-3 {
+  height: 0.75rem !important;
+}
+
+.h-4 {
+  height: 1rem !important;
+}
+
+.h-5 {
+  height: 1.25rem !important;
+}
+
+.h-6 {
+  height: 1.5rem !important;
+}
+
+.h-9 {
+  height: 2.25rem !important;
+}
+
+.w-1\/2 {
+  width: 50% !important;
+}
+
+.w-16 {
+  width: 4rem !important;
+}
+
+.w-3 {
+  width: 0.75rem !important;
+}
+
+.w-4 {
+  width: 1rem !important;
+}
+
+.w-5 {
+  width: 1.25rem !important;
+}
+
+.w-6 {
+  width: 1.5rem !important;
+}
+
+.w-64 {
+  width: 16rem !important;
+}
+
+.w-full {
+  width: 100% !important;
+}
+
+.max-w-3xl {
+  max-width: 48rem !important;
+}
+
+.max-w-screen-md {
+  max-width: 768px !important;
+}
+
+.max-w-screen-sm {
+  max-width: 640px !important;
+}
+
+.max-w-screen-xl {
+  max-width: 1280px !important;
+}
+
+.flex-1 {
+  flex: 1 1 0% !important;
+}
+
+.flex-shrink {
+  flex-shrink: 1 !important;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0 !important;
+}
+
+.-translate-x-full {
+  --tw-translate-x: -100% !important;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
+}
+
+.translate-x-0 {
+  --tw-translate-x: 0px !important;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
+}
+
+.translate-x-full {
+  --tw-translate-x: 100% !important;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
+}
+
+.rotate-180 {
+  --tw-rotate: 180deg !important;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
+}
+
+.transform {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)) !important;
+}
+
+.cursor-default {
+  cursor: default !important;
+}
+
+.cursor-not-allowed {
+  cursor: not-allowed !important;
+}
+
+.cursor-pointer {
+  cursor: pointer !important;
+}
+
+.resize {
+  resize: both !important;
+}
+
+.grid-cols-1 {
+  grid-template-columns: repeat(1, minmax(0, 1fr)) !important;
+}
+
+.grid-cols-2 {
+  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+}
+
+.grid-cols-4 {
+  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+}
+
+.grid-cols-7 {
+  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
+}
+
+.flex-col {
+  flex-direction: column !important;
+}
+
+.flex-col-reverse {
+  flex-direction: column-reverse !important;
+}
+
+.flex-wrap {
+  flex-wrap: wrap !important;
+}
+
+.items-start {
+  align-items: flex-start !important;
+}
+
+.items-end {
+  align-items: flex-end !important;
+}
+
+.items-center {
+  align-items: center !important;
+}
+
+.justify-start {
+  justify-content: flex-start !important;
+}
+
+.justify-end {
+  justify-content: flex-end !important;
+}
+
+.justify-center {
+  justify-content: center !important;
+}
+
+.justify-between {
+  justify-content: space-between !important;
+}
+
+.gap-12 {
+  gap: 3rem !important;
+}
+
+.gap-6 {
+  gap: 1.5rem !important;
+}
+
+.gap-8 {
+  gap: 2rem !important;
+}
+
+.space-x-2 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0 !important;
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse)) !important;
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse))) !important;
+}
+
+.space-x-3 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0 !important;
+  margin-right: calc(0.75rem * var(--tw-space-x-reverse)) !important;
+  margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse))) !important;
+}
+
+.space-x-5 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0 !important;
+  margin-right: calc(1.25rem * var(--tw-space-x-reverse)) !important;
+  margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse))) !important;
+}
+
+.space-y-12 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0 !important;
+  margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse))) !important;
+  margin-bottom: calc(3rem * var(--tw-space-y-reverse)) !important;
+}
+
+.space-y-5 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0 !important;
+  margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse))) !important;
+  margin-bottom: calc(1.25rem * var(--tw-space-y-reverse)) !important;
+}
+
+.space-y-8 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0 !important;
+  margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse))) !important;
+  margin-bottom: calc(2rem * var(--tw-space-y-reverse)) !important;
+}
+
+.place-self-center {
+  place-self: center !important;
+}
+
+.overflow-hidden {
+  overflow: hidden !important;
+}
+
+.rounded {
+  border-radius: 0.25rem !important;
+}
+
+.rounded-full {
+  border-radius: 9999px !important;
+}
+
+.rounded-lg {
+  border-radius: 0.5rem !important;
+}
+
+.rounded-md {
+  border-radius: 0.375rem !important;
+}
+
+.rounded-l-lg {
+  border-top-left-radius: 0.5rem !important;
+  border-bottom-left-radius: 0.5rem !important;
+}
+
+.rounded-r-lg {
+  border-top-right-radius: 0.5rem !important;
+  border-bottom-right-radius: 0.5rem !important;
+}
+
+.rounded-t-lg {
+  border-top-left-radius: 0.5rem !important;
+  border-top-right-radius: 0.5rem !important;
+}
+
+.border {
+  border-width: 1px !important;
+}
+
+.border-0 {
+  border-width: 0px !important;
+}
+
+.border-b {
+  border-bottom-width: 1px !important;
+}
+
+.border-l {
+  border-left-width: 1px !important;
+}
+
+.border-t {
+  border-top-width: 1px !important;
+}
+
+.border-blue-600 {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(28 100 242 / var(--tw-border-opacity)) !important;
+}
+
+.border-blue-700 {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(26 86 219 / var(--tw-border-opacity)) !important;
+}
+
+.border-gray-100 {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(243 244 246 / var(--tw-border-opacity)) !important;
+}
+
+.border-gray-200 {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(229 231 235 / var(--tw-border-opacity)) !important;
+}
+
+.border-gray-300 {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(209 213 219 / var(--tw-border-opacity)) !important;
+}
+
+.border-guardsman-red-200 {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(254 191 191 / var(--tw-border-opacity)) !important;
+}
+
+.border-white {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(255 255 255 / var(--tw-border-opacity)) !important;
+}
+
+.bg-blue-700 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(26 86 219 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-gray-100 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-gray-200 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(229 231 235 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-gray-900 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(17 24 39 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-guardsman-red-200 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(254 191 191 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-guardsman-red-500 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(251 71 71 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-guardsman-red-700 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(236 5 5 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-mallard-50 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(225 236 215 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-white {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-white\/50 {
+  background-color: rgb(255 255 255 / 0.5) !important;
+}
+
+.bg-gray-50 {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(249 250 251 / var(--tw-bg-opacity)) !important;
+}
+
+.bg-opacity-50 {
+  --tw-bg-opacity: 0.5 !important;
+}
+
+.bg-gradient-to-r {
+  background-image: linear-gradient(to right, var(--tw-gradient-stops)) !important;
+}
+
+.from-mallard-300 {
+  --tw-gradient-from: #AECA93 var(--tw-gradient-from-position) !important;
+  --tw-gradient-to: rgb(174 202 147 / 0) var(--tw-gradient-to-position) !important;
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to) !important;
+}
+
+.via-cello-500 {
+  --tw-gradient-to: rgb(52 91 162 / 0)  var(--tw-gradient-to-position) !important;
+  --tw-gradient-stops: var(--tw-gradient-from), #345BA2 var(--tw-gradient-via-position), var(--tw-gradient-to) !important;
+}
+
+.to-guardsman-red-600 {
+  --tw-gradient-to: #FA1F1F var(--tw-gradient-to-position) !important;
+}
+
+.object-cover {
+  -o-object-fit: cover !important;
+     object-fit: cover !important;
+}
+
+.p-1 {
+  padding: 0.25rem !important;
+}
+
+.p-2 {
+  padding: 0.5rem !important;
+}
+
+.p-2\.5 {
+  padding: 0.625rem !important;
+}
+
+.p-4 {
+  padding: 1rem !important;
+}
+
+.p-5 {
+  padding: 1.25rem !important;
+}
+
+.px-2 {
+  padding-left: 0.5rem !important;
+  padding-right: 0.5rem !important;
+}
+
+.px-4 {
+  padding-left: 1rem !important;
+  padding-right: 1rem !important;
+}
+
+.px-5 {
+  padding-left: 1.25rem !important;
+  padding-right: 1.25rem !important;
+}
+
+.py-2 {
+  padding-top: 0.5rem !important;
+  padding-bottom: 0.5rem !important;
+}
+
+.py-2\.5 {
+  padding-top: 0.625rem !important;
+  padding-bottom: 0.625rem !important;
+}
+
+.py-3 {
+  padding-top: 0.75rem !important;
+  padding-bottom: 0.75rem !important;
+}
+
+.py-6 {
+  padding-top: 1.5rem !important;
+  padding-bottom: 1.5rem !important;
+}
+
+.py-8 {
+  padding-top: 2rem !important;
+  padding-bottom: 2rem !important;
+}
+
+.px-6 {
+  padding-left: 1.5rem !important;
+  padding-right: 1.5rem !important;
+}
+
+.py-4 {
+  padding-top: 1rem !important;
+  padding-bottom: 1rem !important;
+}
+
+.pb-8 {
+  padding-bottom: 2rem !important;
+}
+
+.pl-3 {
+  padding-left: 0.75rem !important;
+}
+
+.pr-4 {
+  padding-right: 1rem !important;
+}
+
+.pt-2 {
+  padding-top: 0.5rem !important;
+}
+
+.pt-20 {
+  padding-top: 5rem !important;
+}
+
+.pt-8 {
+  padding-top: 2rem !important;
+}
+
+.text-left {
+  text-align: left !important;
+}
+
+.text-center {
+  text-align: center !important;
+}
+
+.text-2xl {
+  font-size: 1.5rem !important;
+  line-height: 2rem !important;
+}
+
+.text-3xl {
+  font-size: 1.875rem !important;
+  line-height: 2.25rem !important;
+}
+
+.text-4xl {
+  font-size: 2.25rem !important;
+  line-height: 2.5rem !important;
+}
+
+.text-base {
+  font-size: 1rem !important;
+  line-height: 1.5rem !important;
+}
+
+.text-lg {
+  font-size: 1.125rem !important;
+  line-height: 1.75rem !important;
+}
+
+.text-sm {
+  font-size: 0.875rem !important;
+  line-height: 1.25rem !important;
+}
+
+.text-xl {
+  font-size: 1.25rem !important;
+  line-height: 1.75rem !important;
+}
+
+.text-xs {
+  font-size: 0.75rem !important;
+  line-height: 1rem !important;
+}
+
+.font-bold {
+  font-weight: 700 !important;
+}
+
+.font-extrabold {
+  font-weight: 800 !important;
+}
+
+.font-light {
+  font-weight: 300 !important;
+}
+
+.font-medium {
+  font-weight: 500 !important;
+}
+
+.font-normal {
+  font-weight: 400 !important;
+}
+
+.font-semibold {
+  font-weight: 600 !important;
+}
+
+.uppercase {
+  text-transform: uppercase !important;
+}
+
+.leading-6 {
+  line-height: 1.5rem !important;
+}
+
+.leading-9 {
+  line-height: 2.25rem !important;
+}
+
+.leading-none {
+  line-height: 1 !important;
+}
+
+.leading-tight {
+  line-height: 1.25 !important;
+}
+
+.tracking-tight {
+  letter-spacing: -0.025em !important;
+}
+
+.text-blue-600 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(28 100 242 / var(--tw-text-opacity)) !important;
+}
+
+.text-gray-400 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(156 163 175 / var(--tw-text-opacity)) !important;
+}
+
+.text-gray-500 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(107 114 128 / var(--tw-text-opacity)) !important;
+}
+
+.text-gray-600 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(75 85 99 / var(--tw-text-opacity)) !important;
+}
+
+.text-gray-700 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(55 65 81 / var(--tw-text-opacity)) !important;
+}
+
+.text-gray-900 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(17 24 39 / var(--tw-text-opacity)) !important;
+}
+
+.text-guardsman-red {
+  --tw-text-opacity: 1 !important;
+  color: rgb(196 4 4 / var(--tw-text-opacity)) !important;
+}
+
+.text-guardsman-red-400 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(252 111 111 / var(--tw-text-opacity)) !important;
+}
+
+.text-guardsman-red-500 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(251 71 71 / var(--tw-text-opacity)) !important;
+}
+
+.text-guardsman-red-600 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(250 31 31 / var(--tw-text-opacity)) !important;
+}
+
+.text-guardsman-red-900 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(141 3 3 / var(--tw-text-opacity)) !important;
+}
+
+.text-neutral-600 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(82 82 82 / var(--tw-text-opacity)) !important;
+}
+
+.text-white {
+  --tw-text-opacity: 1 !important;
+  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
+}
+
+.text-gray-800 {
+  --tw-text-opacity: 1 !important;
+  color: rgb(31 41 55 / var(--tw-text-opacity)) !important;
+}
+
+.opacity-0 {
+  opacity: 0 !important;
+}
+
+.opacity-100 {
+  opacity: 1 !important;
+}
+
+.shadow {
+  --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1) !important;
+  --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color) !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+}
+
+.shadow-lg {
+  --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1) !important;
+  --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color) !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+}
+
+.shadow-md {
+  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1) !important;
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color) !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+}
+
+.shadow-sm {
+  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05) !important;
+  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color) !important;
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow) !important;
+}
+
+.shadow-guardsman-red-200 {
+  --tw-shadow-color: #FEBFBF !important;
+  --tw-shadow: var(--tw-shadow-colored) !important;
+}
+
+.shadow-mallard-200 {
+  --tw-shadow-color: #C3D8AE !important;
+  --tw-shadow: var(--tw-shadow-colored) !important;
+}
+
+.shadow-pirate-gold-200 {
+  --tw-shadow-color: #FFCF3A !important;
+  --tw-shadow: var(--tw-shadow-colored) !important;
+}
+
+.outline {
+  outline-style: solid !important;
+}
+
+.blur {
+  --tw-blur: blur(8px) !important;
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
+}
+
+.filter {
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow) !important;
+}
+
+.transition {
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-backdrop-filter !important;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter !important;
+  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-backdrop-filter !important;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
+  transition-duration: 150ms !important;
+}
+
+.transition-all {
+  transition-property: all !important;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
+  transition-duration: 150ms !important;
+}
+
+.transition-opacity {
+  transition-property: opacity !important;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1) !important;
+  transition-duration: 150ms !important;
+}
+
+.ease-out {
+  transition-timing-function: cubic-bezier(0, 0, 0.2, 1) !important;
+}
+
+.hover\:border-gray-300:hover {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(209 213 219 / var(--tw-border-opacity)) !important;
+}
+
+.hover\:bg-blue-800:hover {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(30 66 159 / var(--tw-bg-opacity)) !important;
+}
+
+.hover\:bg-gray-100:hover {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity)) !important;
+}
+
+.hover\:bg-guardsman-red-800:hover {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(196 4 4 / var(--tw-bg-opacity)) !important;
+}
+
+.hover\:bg-mallard-100:hover {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(215 229 201 / var(--tw-bg-opacity)) !important;
+}
+
+.hover\:bg-mallard-50:hover {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(225 236 215 / var(--tw-bg-opacity)) !important;
+}
+
+.hover\:bg-white:hover {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity)) !important;
+}
+
+.hover\:text-blue-600:hover {
+  --tw-text-opacity: 1 !important;
+  color: rgb(28 100 242 / var(--tw-text-opacity)) !important;
+}
+
+.hover\:text-gray-600:hover {
+  --tw-text-opacity: 1 !important;
+  color: rgb(75 85 99 / var(--tw-text-opacity)) !important;
+}
+
+.hover\:text-gray-900:hover {
+  --tw-text-opacity: 1 !important;
+  color: rgb(17 24 39 / var(--tw-text-opacity)) !important;
+}
+
+.hover\:underline:hover {
+  text-decoration-line: underline !important;
+}
+
+.focus\:outline-none:focus {
+  outline: 2px solid transparent !important;
+  outline-offset: 2px !important;
+}
+
+.focus\:ring-2:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
+}
+
+.focus\:ring-4:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color) !important;
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color) !important;
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000) !important;
+}
+
+.focus\:ring-blue-300:focus {
+  --tw-ring-opacity: 1 !important;
+  --tw-ring-color: rgb(164 202 254 / var(--tw-ring-opacity)) !important;
+}
+
+.focus\:ring-gray-200:focus {
+  --tw-ring-opacity: 1 !important;
+  --tw-ring-color: rgb(229 231 235 / var(--tw-ring-opacity)) !important;
+}
+
+.focus\:ring-guardsman-red-300:focus {
+  --tw-ring-opacity: 1 !important;
+  --tw-ring-color: rgb(253 151 151 / var(--tw-ring-opacity)) !important;
+}
+
+:is(.dark .dark\:border-blue-500) {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(63 131 248 / var(--tw-border-opacity)) !important;
+}
+
+:is(.dark .dark\:border-gray-600) {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(75 85 99 / var(--tw-border-opacity)) !important;
+}
+
+:is(.dark .dark\:border-gray-700) {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(55 65 81 / var(--tw-border-opacity)) !important;
+}
+
+:is(.dark .dark\:border-guardsman-red-700) {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(236 5 5 / var(--tw-border-opacity)) !important;
+}
+
+:is(.dark .dark\:border-guardsman-red-900) {
+  --tw-border-opacity: 1 !important;
+  border-color: rgb(141 3 3 / var(--tw-border-opacity)) !important;
+}
+
+:is(.dark .dark\:border-transparent) {
+  border-color: transparent !important;
+}
+
+:is(.dark .dark\:bg-blue-600) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(28 100 242 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-gray-600) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(75 85 99 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-gray-700) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(55 65 81 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-gray-800) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-gray-800\/50) {
+  background-color: rgb(31 41 55 / 0.5) !important;
+}
+
+:is(.dark .dark\:bg-guardsman-red-600) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(250 31 31 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-guardsman-red-700) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(236 5 5 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-mallard-800) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(72 97 47 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-mallard-900) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(52 70 34 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:bg-opacity-80) {
+  --tw-bg-opacity: 0.8 !important;
+}
+
+:is(.dark .dark\:text-blue-500) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(63 131 248 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:text-gray-400) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(156 163 175 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:text-gray-600) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(75 85 99 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:text-guardsman-red-400) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(252 111 111 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:text-guardsman-red-500) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(251 71 71 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:text-neutral-200) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(229 229 229 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:text-white) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:bg-blue-700:hover) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(26 86 219 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:bg-gray-600:hover) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(75 85 99 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:bg-gray-800:hover) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(31 41 55 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:bg-guardsman-red-700:hover) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(236 5 5 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:bg-mallard-700:hover) {
+  --tw-bg-opacity: 1 !important;
+  background-color: rgb(93 125 61 / var(--tw-bg-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:text-blue-500:hover) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(63 131 248 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:text-gray-300:hover) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(209 213 219 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:hover\:text-white:hover) {
+  --tw-text-opacity: 1 !important;
+  color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
+}
+
+:is(.dark .dark\:focus\:ring-gray-600:focus) {
+  --tw-ring-opacity: 1 !important;
+  --tw-ring-color: rgb(75 85 99 / var(--tw-ring-opacity)) !important;
+}
+
+:is(.dark .dark\:focus\:ring-guardsman-red-800:focus) {
+  --tw-ring-opacity: 1 !important;
+  --tw-ring-color: rgb(196 4 4 / var(--tw-ring-opacity)) !important;
+}
+
+@media (min-width: 640px) {
+  .sm\:mx-auto {
+    margin-left: auto !important;
+    margin-right: auto !important;
+  }
+
+  .sm\:ml-6 {
+    margin-left: 1.5rem !important;
+  }
+
+  .sm\:mr-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .sm\:block {
+    display: block !important;
+  }
+
+  .sm\:flex {
+    display: flex !important;
+  }
+
+  .sm\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+  }
+
+  .sm\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
+  }
+
+  .sm\:gap-12 {
+    gap: 3rem !important;
+  }
+
+  .sm\:pr-8 {
+    padding-right: 2rem !important;
+  }
+
+  .sm\:text-lg {
+    font-size: 1.125rem !important;
+    line-height: 1.75rem !important;
+  }
+}
+
+@media (min-width: 768px) {
+  .md\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
+  }
+
+  .md\:p-8 {
+    padding: 2rem !important;
+  }
+
+  .md\:px-0 {
+    padding-left: 0px !important;
+    padding-right: 0px !important;
+  }
+
+  .md\:text-3xl {
+    font-size: 1.875rem !important;
+    line-height: 2.25rem !important;
+  }
+
+  .md\:text-5xl {
+    font-size: 3rem !important;
+    line-height: 1 !important;
+  }
+
+  .md\:text-lg {
+    font-size: 1.125rem !important;
+    line-height: 1.75rem !important;
+  }
+}
+
+@media (min-width: 1024px) {
+  .lg\:order-1 {
+    order: 1 !important;
+  }
+
+  .lg\:order-2 {
+    order: 2 !important;
+  }
+
+  .lg\:col-span-4 {
+    grid-column: span 4 / span 4 !important;
+  }
+
+  .lg\:col-span-8 {
+    grid-column: span 8 / span 8 !important;
+  }
+
+  .lg\:my-8 {
+    margin-top: 2rem !important;
+    margin-bottom: 2rem !important;
+  }
+
+  .lg\:mb-0 {
+    margin-bottom: 0px !important;
+  }
+
+  .lg\:mb-12 {
+    margin-bottom: 3rem !important;
+  }
+
+  .lg\:mb-8 {
+    margin-bottom: 2rem !important;
+  }
+
+  .lg\:mr-0 {
+    margin-right: 0px !important;
+  }
+
+  .lg\:mt-0 {
+    margin-top: 0px !important;
+  }
+
+  .lg\:flex {
+    display: flex !important;
+  }
+
+  .lg\:grid {
+    display: grid !important;
+  }
+
+  .lg\:hidden {
+    display: none !important;
+  }
+
+  .lg\:w-auto {
+    width: auto !important;
+  }
+
+  .lg\:grid-cols-12 {
+    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
+  }
+
+  .lg\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
+  }
+
+  .lg\:grid-cols-4 {
+    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
+  }
+
+  .lg\:grid-cols-6 {
+    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
+  }
+
+  .lg\:flex-row {
+    flex-direction: row !important;
+  }
+
+  .lg\:justify-center {
+    justify-content: center !important;
+  }
+
+  .lg\:gap-16 {
+    gap: 4rem !important;
+  }
+
+  .lg\:gap-8 {
+    gap: 2rem !important;
+  }
+
+  .lg\:space-x-8 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-x-reverse: 0 !important;
+    margin-right: calc(2rem * var(--tw-space-x-reverse)) !important;
+    margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse))) !important;
+  }
+
+  .lg\:space-y-20 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-y-reverse: 0 !important;
+    margin-top: calc(5rem * calc(1 - var(--tw-space-y-reverse))) !important;
+    margin-bottom: calc(5rem * var(--tw-space-y-reverse)) !important;
+  }
+
+  .lg\:border-0 {
+    border-width: 0px !important;
+  }
+
+  .lg\:bg-transparent {
+    background-color: transparent !important;
+  }
+
+  .lg\:p-0 {
+    padding: 0px !important;
+  }
+
+  .lg\:p-10 {
+    padding: 2.5rem !important;
+  }
+
+  .lg\:px-5 {
+    padding-left: 1.25rem !important;
+    padding-right: 1.25rem !important;
+  }
+
+  .lg\:px-6 {
+    padding-left: 1.5rem !important;
+    padding-right: 1.5rem !important;
+  }
+
+  .lg\:py-16 {
+    padding-top: 4rem !important;
+    padding-bottom: 4rem !important;
+  }
+
+  .lg\:py-2 {
+    padding-top: 0.5rem !important;
+    padding-bottom: 0.5rem !important;
+  }
+
+  .lg\:py-2\.5 {
+    padding-top: 0.625rem !important;
+    padding-bottom: 0.625rem !important;
+  }
+
+  .lg\:py-24 {
+    padding-top: 6rem !important;
+    padding-bottom: 6rem !important;
+  }
+
+  .lg\:pb-16 {
+    padding-bottom: 4rem !important;
+  }
+
+  .lg\:pt-28 {
+    padding-top: 7rem !important;
+  }
+
+  .lg\:text-xl {
+    font-size: 1.25rem !important;
+    line-height: 1.75rem !important;
+  }
+
+  .lg\:text-guardsman-red-700 {
+    --tw-text-opacity: 1 !important;
+    color: rgb(236 5 5 / var(--tw-text-opacity)) !important;
+  }
+
+  .lg\:hover\:bg-transparent:hover {
+    background-color: transparent !important;
+  }
+
+  .lg\:hover\:text-guardsman-red-700:hover {
+    --tw-text-opacity: 1 !important;
+    color: rgb(236 5 5 / var(--tw-text-opacity)) !important;
+  }
+
+  :is(.dark .lg\:dark\:hover\:bg-transparent:hover) {
+    background-color: transparent !important;
+  }
+
+  :is(.dark .lg\:dark\:hover\:text-white:hover) {
+    --tw-text-opacity: 1 !important;
+    color: rgb(255 255 255 / var(--tw-text-opacity)) !important;
+  }
+}
+
+@media (min-width: 1280px) {
+  .xl\:gap-0 {
+    gap: 0px !important;
+  }
+
+  .xl\:gap-16 {
+    gap: 4rem !important;
+  }
+
+  .xl\:gap-24 {
+    gap: 6rem !important;
+  }
+
+  .xl\:text-6xl {
+    font-size: 3.75rem !important;
+    line-height: 1 !important;
+  }
+}
\ No newline at end of file
diff --git a/Resources/assets/sass/app.scss b/Resources/assets/sass/app.scss
new file mode 100644
index 0000000..e69de29
diff --git a/Resources/lang/.gitkeep b/Resources/lang/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Resources/views/.gitkeep b/Resources/views/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Resources/views/cakupan.blade.php b/Resources/views/cakupan.blade.php
new file mode 100644
index 0000000..8ea1fed
--- /dev/null
+++ b/Resources/views/cakupan.blade.php
@@ -0,0 +1,229 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <link rel="canonical" href="https://genom.dharma.or.id/"/>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Kerjasama Penelitian Genomik Panin 2023</title>
+
+    <!-- Meta SEO -->
+    <meta name="title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta name="description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta name="robots" content="index, follow">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="language" content="English">
+    <meta name="author" content="Yayasan Satriabudi Dharma Setia">
+
+    <!-- Social media share -->
+    <meta property="og:title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta property="og:site_name" content="Yayasan Satriabudi Dharma Setia">
+    <meta property="og:url" content=https://genom.dharma.or.id">
+    <meta property="og:description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta property="og:type" content="">
+    <meta property="og:image" content="{{ asset('Screenshot 2023-08-23 153008.png') }}">
+
+    <!-- Favicon -->
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <link href="./output.css" rel="stylesheet">
+
+</head>
+<body>
+<header class="fixed w-full z-10" id="home">
+    <nav class="relative bg-white border-gray-200 py-2.5 dark:bg-mallard-900 shadow-md shadow-mallard-200">
+        <div class="flex flex-wrap items-center justify-between max-w-screen-xl px-4 mx-auto">
+            <a href="#" class="flex items-center">
+                <img src="{{ asset('assets/media/logos/logo.png') }}" class="h-12 mr-3" alt="Yayasan Satriabudi Dharma Setia"/>
+            </a>
+            <div class="flex items-center lg:order-2">
+                <a href="{{ URL::to('peneliti') }}" class="text-white bg-guardsman-red-700 hover:bg-guardsman-red-800 focus:ring-4 focus:ring-guardsman-red-300 font-medium rounded-md text-sm px-4 lg:px-5 py-2 lg:py-2.5 sm:mr-2 lg:mr-0 dark:bg-guardsman-red-600 dark:hover:bg-guardsman-red-700 focus:outline-none dark:focus:ring-guardsman-red-800">Peneliti</a>
+                <button data-collapse-toggle="mobile-menu-2" type="button" class="inline-flex items-center p-2 ml-1 text-sm text-gray-500 rounded-lg lg:hidden hover:bg-mallard-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-mallard-700 dark:focus:ring-gray-600" aria-controls="mobile-menu-2" aria-expanded="false">
+                    <span class="sr-only">Open main menu</span>
+                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path>
+                    </svg>
+                    <svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
+                    </svg>
+                </button>
+            </div>
+            <div class="items-center justify-between hidden w-full lg:flex lg:w-auto lg:order-1" id="mobile-menu-2">
+                <ul class="flex flex-col mt-4 font-medium lg:flex-row lg:space-x-8 lg:mt-0" x-data="{ activeMenu: 'cakupan' }">
+                    <li>
+                        <a href="{{ URL::to('/') }}" @click="activeMenu='home'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='home'}"
+                           aria-current="page">Home</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#cakupan') }}" @click="activeMenu='cakupan'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='cakupan'}">Cakupan</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#skema') }}" @click="activeMenu='skema'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='skema'}">Skema Kerjasama</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#pendaftaran') }}" @click="activeMenu='pendaftaran'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='pendaftaran'}">Pendaftaran</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('facility') }}" @click="activeMenu='facility'" class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='facility'}">Sequencing Facility</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+</header>
+
+<!-- Start block -->
+<section id="facility" class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto space-y-12 lg:space-y-20 lg:py-24 lg:px-6">
+        <!-- Row -->
+        <div class="items-center">
+            <div class="text-gray-500 sm:text-lg dark:text-gray-400">
+                <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Cakupan Kerjasama Bahan Habis Pakai</h2>
+                <!-- List -->
+                <table class="w-full text-lg text-left text-gray-700 dark:text-gray-400">
+                    <thead class="text-lg text-gray-800 uppercase bg-gray-100 dark:bg-gray-800 dark:text-gray-400">
+                    <tr>
+                        <th scope="col" class="px-6 py-3">Nomor</th>
+                        <th scope="col" class="px-6 py-3">Platform</th>
+                        <th scope="col" class="px-6 py-3">Kategori</th>
+                        <th scope="col" class="px-6 py-3">Nama</th>
+                        <th scope="col" class="px-6 py-3">Harga</th>
+                    </tr>
+                    </thead>
+                    <tbody>
+                    @php $no=1; @endphp
+                    @foreach($data as $row)
+                        <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
+                            <td class="px-6 py-4">{{ $no }}</td>
+                            <td class="px-6 py-4">{{ $row['Platform'] }}</td>
+                            <td class="px-6 py-4">{{ $row['Kategori'] }}</td>
+                            <td class="px-6 py-4">{{ $row['Nama'] }}
+                                <br><em class="text-sm">Kode Unit : {{ $row['Kode Unit'] }}</em></td>
+                            @php
+                                $harga = str_replace('$','',$row['Harga']);
+                                $harga = str_replace('.00','',$harga);
+                                $harga = str_replace(',','',$harga);
+                            @endphp
+                            <td class="px-6 py-4">Rp {{ number_format($harga*($usd+($usd*0.05)),2,',','.') }}</td>
+                        </tr>
+                        @php $no++; @endphp
+                    @endforeach
+                    </tbody>
+                </table>
+                <em>Kurs Dolar Tanggal {{ $date }} Rp. Rp {{ number_format($usd,2,',','.') }}</em><br>
+                <em>Kurs Dolar dapat berubah sewaktu-waktu</em>
+                <br> <br>
+                <em class="text-sm">Harga belum termasuk :</em> <br>
+                <em class="text-sm">1. Bea masuk, PPH, dan PPN sekitar 15-20% dari harga dasar barang,</em> <br>
+                <em class="text-sm">2. Ongkos kirim dengan estimasi Rp. 500.000 - 1.500.000 per pengiriman per kg,</em> <br>
+                <em class="text-sm">3. Administrasi, penanganan dan penyimpanan barang yang berkisar 5% dari harga dasar barang.</em>
+            </div>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+<!-- Start block -->
+<!-- Start block -->
+<section id="pendaftaran" class="bg-mallard-50 dark:bg-mallard-800 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-16 lg:px-6">
+        <div class="max-w-screen-sm mx-auto text-center">
+            <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Instruksi Pendaftaran</h2>
+            <p class="mb-6 font-light text-gray-700 dark:text-gray-600 md:text-lg">Informasi lebih lanjut dapat menghubungi kami melalui
+                <a href="mailto:omics@dharma.or.id" class="text-guardsman-red-600">omics@dharma.or.id</a> atau menghubungi
+                <a href="tel:+620895324832922" class="text-guardsman-red-600">0895-3248-32922 (whatsapp)</a>. Skema ini terus dibuka sesuai dengan ketersediaan dana YSDS.
+            </p>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+
+<!-- Start block -->
+<section class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="items-center max-w-screen-xl px-4 py-6 mx-auto lg:grid lg:grid-cols-4 lg:gap-16 xl:gap-24 lg:px-6">
+        <div class="col-span-2">
+            <h5 class="mt-3 mb-4 text-2xl font-extrabold tracking-tight text-gray-900 md:text-3xl dark:text-white">Catatan Perubahan</h5>
+            <ol class="relative border-l border-guardsman-red-200 dark:border-guardsman-red-700">
+                <li class="ml-4">
+                    18 Juli 2023 : Update informasi kerjasama bahan habis pakai sequencing
+                </li>
+                <li class="ml-4">
+                    01 Mei 2023 : Update informasi kerjasama penelitian genomik 2023
+                </li>
+                <li class="ml-4">
+                    16 November 2022 : Update informasi penutupan pendaftaran hibah
+                </li>
+                <li class="ml-4">
+                    01 November 2022 : Ekstensi deadline hibah dan perubahan timeline hibah
+                </li>
+                <li class="ml-4">
+                    04 Oktober 2022 : Update Dokumen
+                </li>
+                <li class="ml-4">
+                    01 Oktober 2022 : Peluncuran website
+                </li>
+            </ol>
+        </div>
+    </div>
+    <div class="max-w-screen-xl p-4 mx-auto">
+        <hr class="my-6 border-guardsman-red-200 sm:mx-auto dark:border-guardsman-red-700">
+        <div class="text-center">
+                <span class="block text-sm text-center text-gray-500 dark:text-gray-400">© 2022-2023 <a href="https://dharma.or.id" class="text-guardsman-red-600 hover:underline dark:text-guardsman-red-500">Yayasan Satriabudi Dharma Setia</a>
+                </span>
+            <ul class="flex justify-center mt-5 space-x-5">
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c5.51 0 10-4.48 10-10S17.51 2 12 2zm6.605 4.61a8.502 8.502 0 011.93 5.314c-.281-.054-3.101-.629-5.943-.271-.065-.141-.12-.293-.184-.445a25.416 25.416 0 00-.564-1.236c3.145-1.28 4.577-3.124 4.761-3.362zM12 3.475c2.17 0 4.154.813 5.662 2.148-.152.216-1.443 1.941-4.48 3.08-1.399-2.57-2.95-4.675-3.189-5A8.687 8.687 0 0112 3.475zm-3.633.803a53.896 53.896 0 013.167 4.935c-3.992 1.063-7.517 1.04-7.896 1.04a8.581 8.581 0 014.729-5.975zM3.453 12.01v-.26c.37.01 4.512.065 8.775-1.215.25.477.477.965.694 1.453-.109.033-.228.065-.336.098-4.404 1.42-6.747 5.303-6.942 5.629a8.522 8.522 0 01-2.19-5.705zM12 20.547a8.482 8.482 0 01-5.239-1.8c.152-.315 1.888-3.656 6.703-5.337.022-.01.033-.01.054-.022a35.318 35.318 0 011.823 6.475 8.4 8.4 0 01-3.341.684zm4.761-1.465c-.086-.52-.542-3.015-1.659-6.084 2.679-.423 5.022.271 5.314.369a8.468 8.468 0 01-3.655 5.715z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+            </ul>
+        </div>
+    </div>
+</section>
+<script src="https://unpkg.com/flowbite@1.4.1/dist/flowbite.js"></script>
+</body>
+</html>
diff --git a/Resources/views/ci.blade.php b/Resources/views/ci.blade.php
new file mode 100644
index 0000000..0c827fc
--- /dev/null
+++ b/Resources/views/ci.blade.php
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html class="light">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <title>Pemeriksaan Virus Dengue dan Wolbachia di Kota Cimahi dengan Metode WGS - Informasi Klinis V.1.01 | Kerjasama Penelitian Genomik Panin 2023</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
+    <script>
+        tailwind.config = {
+            darkMode: 'class',
+            important: true,
+            theme: {
+                extend: {
+                    colors: {
+                        'pirate-gold': {  DEFAULT: '#BF9000',  '50': '#FFDE78',  '100': '#FFD963',  '200': '#FFCF3A',  '300': '#FFC512',  '400': '#E8AF00',  '500': '#BF9000',  '600': '#876600',  '700': '#4F3B00',  '800': '#171100',  '900': '#000000'},
+                        'cello': {  DEFAULT: '#203864',  '50': '#6C8FD0',  '100': '#5C83CB',  '200': '#3E6CC1',  '300': '#345BA2',  '400': '#2A4983',  '500': '#203864',  '600': '#122039',  '700': '#05080F',  '800': '#000000',  '900': '#000000'},
+                        'san-marino': {  DEFAULT: '#4873AD',  '50': '#C6D4E7',  '100': '#B7C9E1',  '200': '#9AB3D5',  '300': '#7D9EC9',  '400': '#6188BD',  '500': '#4873AD',  '600': '#385985',  '700': '#273E5E',  '800': '#172436',  '900': '#060A0F'},
+                        'mine-shaft': {  DEFAULT: '#2B2B2B',  '50': '#878787',  '100': '#7D7D7D',  '200': '#686868',  '300': '#545454',  '400': '#3F3F3F',  '500': '#2B2B2B',  '600': '#0F0F0F',  '700': '#000000',  '800': '#000000',  '900': '#000000'},
+                    },
+                    fontFamily: {
+                        popins: ['Poppins', 'sans-serif'],
+                    },
+                }
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div class=" mx-auto font-popins">
+        <nav class="bg-white px-2 sm:px-4 py-4 dark:bg-gray-900 sticky  w-full z-20 top-0 left-0 border-b border-gray-200 dark:border-gray-600" x-data="{ isOpen: false,activeMenu: 'home' }">
+            <div class="container flex flex-wrap justify-center items-center mx-auto"  @keydown.escape="isOpen = false" @click.away="isOpen = false">
+                <a href="{{ URL::to('/') }}" class="flex items-center">
+                    <img src="{{ asset('assets/media/logos/logo.png') }}" class="mr-3 h-6 sm:h-20" alt="Flowbite Logo">
+                </a>
+            </div>
+        </nav>
+        <div class="container mx-auto relative bg-gray-100">
+            <div  class="flex flex-col space-y-12 md:space-y-28 py-20 items-center justify-end w-full bg-white" style="padding: 0px 35px">
+                <script src="https://www.cognitoforms.com/f/seamless.js" data-key="osMhxmcf0E2QmSzDlyjBiQ" data-form="84"></script>
+            </div>
+            <div class="flex flex-col space-y-11 text-center md:items-center justify-end px-10 md:px-36 pt-20 pb-16 bg-cello w-full">
+                <p class="text-xl text-white">© Copyright Yayasan Satriabudi Dharma Setia. 2023</p>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
diff --git a/Resources/views/consent.blade.php b/Resources/views/consent.blade.php
new file mode 100644
index 0000000..4d4b67a
--- /dev/null
+++ b/Resources/views/consent.blade.php
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html class="light">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <title>Informed Consent | Kerjasama Penelitian Genomik Panin 2023</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
+    <script>
+        tailwind.config = {
+            darkMode: 'class',
+            important: true,
+            theme: {
+                extend: {
+                    colors: {
+                        'pirate-gold': {  DEFAULT: '#BF9000',  '50': '#FFDE78',  '100': '#FFD963',  '200': '#FFCF3A',  '300': '#FFC512',  '400': '#E8AF00',  '500': '#BF9000',  '600': '#876600',  '700': '#4F3B00',  '800': '#171100',  '900': '#000000'},
+                        'cello': {  DEFAULT: '#203864',  '50': '#6C8FD0',  '100': '#5C83CB',  '200': '#3E6CC1',  '300': '#345BA2',  '400': '#2A4983',  '500': '#203864',  '600': '#122039',  '700': '#05080F',  '800': '#000000',  '900': '#000000'},
+                        'san-marino': {  DEFAULT: '#4873AD',  '50': '#C6D4E7',  '100': '#B7C9E1',  '200': '#9AB3D5',  '300': '#7D9EC9',  '400': '#6188BD',  '500': '#4873AD',  '600': '#385985',  '700': '#273E5E',  '800': '#172436',  '900': '#060A0F'},
+                        'mine-shaft': {  DEFAULT: '#2B2B2B',  '50': '#878787',  '100': '#7D7D7D',  '200': '#686868',  '300': '#545454',  '400': '#3F3F3F',  '500': '#2B2B2B',  '600': '#0F0F0F',  '700': '#000000',  '800': '#000000',  '900': '#000000'},
+                    },
+                    fontFamily: {
+                        popins: ['Poppins', 'sans-serif'],
+                    },
+                }
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div class=" mx-auto font-popins">
+        <nav class="bg-white px-2 sm:px-4 py-4 dark:bg-gray-900 sticky  w-full z-20 top-0 left-0 border-b border-gray-200 dark:border-gray-600" x-data="{ isOpen: false,activeMenu: 'home' }">
+            <div class="container flex flex-wrap justify-center items-center mx-auto"  @keydown.escape="isOpen = false" @click.away="isOpen = false">
+                <a href="{{ URL::to('/') }}" class="flex items-center">
+                    <img src="{{ asset('assets/media/logos/logo.png') }}" class="mr-3 h-6 sm:h-20" alt="Flowbite Logo">
+                </a>
+            </div>
+        </nav>
+        <div class="container mx-auto relative bg-gray-100">
+            <div  class="flex flex-col space-y-12 md:space-y-28 py-20 items-center justify-end w-full bg-white" style="padding: 0px 35px">
+                <script src="https://www.cognitoforms.com/f/seamless.js" data-key="osMhxmcf0E2QmSzDlyjBiQ" data-form="82"></script>
+            </div>
+            <div class="flex flex-col space-y-11 text-center md:items-center justify-end px-10 md:px-36 pt-20 pb-16 bg-cello w-full">
+                <p class="text-xl text-white">© Copyright Yayasan Satriabudi Dharma Setia. 2023</p>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
diff --git a/Resources/views/domain.blade.php b/Resources/views/domain.blade.php
new file mode 100644
index 0000000..1c0fab7
--- /dev/null
+++ b/Resources/views/domain.blade.php
@@ -0,0 +1,53 @@
+<!doctype html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport"
+          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
+    <meta http-equiv="X-UA-Compatible" content="ie=edge">
+    <title>Domain Checker | Yayasan Satriabudi Dharma Setia</title>
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" />
+    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" />
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/tw-elements/dist/css/index.min.css" />
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script>
+        tailwind.config = {
+            theme: {
+                extend: {
+                    fontFamily: {
+                        sans: ['Inter', 'sans-serif'],
+                    },
+                }
+            }
+        }
+    </script>
+    <script src="https://cdn.jsdelivr.net/npm/tw-elements/dist/js/index.min.js"></script>
+</head>
+<body>
+<div class="flex justify-center items-center w-full h-screen">
+    <div class="mb-3 xl:w-96 text-center">
+        <form method="GET" action="{{ URL::to('/domain') }}">
+            @csrf
+            <h1 class="text-2xl font-bold text-gray-800">Domain Checker</h1>
+            <div class="input-group relative flex flex-wrap items-stretch w-full mb-4">
+
+                <input type="search" name="search" class="form-control relative flex-auto min-w-0 block w-full px-3 py-1.5 text-base font-normal text-gray-700 bg-white bg-clip-padding border border-solid border-gray-300 rounded transition ease-in-out m-0 focus:text-gray-700 focus:bg-white focus:border-blue-600 focus:outline-none" placeholder="Search Domain" aria-label="Search" aria-describedby="button-addon2">
+                <button type="submit" class="btn inline-block px-6 py-2.5 bg-blue-600 text-white font-medium text-xs leading-tight uppercase rounded shadow-md hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700  focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg transition duration-150 ease-in-out flex items-center" type="button" id="button-addon2">
+                    <svg aria-hidden="true" focusable="false" data-prefix="fas" data-icon="search" class="w-4" role="img" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+                        <path fill="currentColor" d="M505 442.7L405.3 343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3 44-79.7 44-128C416 93.1 322.9 0 208 0S0 93.1 0 208s93.1 208 208 208c48.3 0 92.7-16.4 128-44v16.3c0 6.4 2.5 12.5 7 17l99.7 99.7c9.4 9.4 24.6 9.4 33.9 0l28.3-28.3c9.4-9.4 9.4-24.6.1-34zM208 336c-70.7 0-128-57.2-128-128 0-70.7 57.2-128 128-128 70.7 0 128 57.2 128 128 0 70.7-57.2 128-128 128z"></path>
+                    </svg>
+                </button>
+
+            </div>
+        </form>
+        @if(isset($data))
+            @if($data->resultCode==1000)
+               <button type="button" class="text-white bg-green-700 hover:bg-green-800 focus:outline-none focus:ring-4 focus:ring-green-300 font-medium rounded-full text-sm px-5 py-2.5 text-center mr-2 mb-2 dark:bg-green-600 dark:hover:bg-green-700 dark:focus:ring-green-800"><i class="fa-regular fa-circle-check text-white"></i> Domain Available</button>
+            @else
+                <button type="button" class="text-white bg-yellow-400 hover:bg-yellow-500 focus:outline-none focus:ring-4 focus:ring-yellow-300 font-medium rounded-full text-sm px-5 py-2.5 text-center mr-2 mb-2 dark:focus:ring-yellow-900"><i class="fa-regular fa-circle-xmark text-white"></i></i> {{ $data->resultMsg }}</button>
+            @endif
+        @endif
+    </div>
+</div>
+</body>
+</html>
diff --git a/Resources/views/facility.blade.php b/Resources/views/facility.blade.php
new file mode 100644
index 0000000..d430c4b
--- /dev/null
+++ b/Resources/views/facility.blade.php
@@ -0,0 +1,210 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <link rel="canonical" href="https://genom.dharma.or.id/"/>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Kerjasama Penelitian Genomik Panin 2023</title>
+
+    <!-- Meta SEO -->
+    <meta name="title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta name="description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta name="robots" content="index, follow">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="language" content="English">
+    <meta name="author" content="Yayasan Satriabudi Dharma Setia">
+
+    <!-- Social media share -->
+    <meta property="og:title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta property="og:site_name" content="Yayasan Satriabudi Dharma Setia">
+    <meta property="og:url" content=https://genom.dharma.or.id">
+    <meta property="og:description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta property="og:type" content="">
+    <meta property="og:image" content="{{ asset('Screenshot 2023-08-23 153008.png') }}">
+
+    <!-- Favicon -->
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <link href="./output.css" rel="stylesheet">
+
+</head>
+<body>
+<header class="fixed w-full z-10" id="home">
+    <nav class="relative bg-white border-gray-200 py-2.5 dark:bg-mallard-900 shadow-md shadow-mallard-200">
+        <div class="flex flex-wrap items-center justify-between max-w-screen-xl px-4 mx-auto">
+            <a href="#" class="flex items-center">
+                <img src="{{ asset('assets/media/logos/logo.png') }}" class="h-12 mr-3" alt="Yayasan Satriabudi Dharma Setia"/>
+            </a>
+            <div class="flex items-center lg:order-2">
+                <a href="{{ URL::to('peneliti') }}" class="text-white bg-guardsman-red-700 hover:bg-guardsman-red-800 focus:ring-4 focus:ring-guardsman-red-300 font-medium rounded-md text-sm px-4 lg:px-5 py-2 lg:py-2.5 sm:mr-2 lg:mr-0 dark:bg-guardsman-red-600 dark:hover:bg-guardsman-red-700 focus:outline-none dark:focus:ring-guardsman-red-800">Peneliti</a>
+                <button data-collapse-toggle="mobile-menu-2" type="button" class="inline-flex items-center p-2 ml-1 text-sm text-gray-500 rounded-lg lg:hidden hover:bg-mallard-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-mallard-700 dark:focus:ring-gray-600" aria-controls="mobile-menu-2" aria-expanded="false">
+                    <span class="sr-only">Open main menu</span>
+                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path>
+                    </svg>
+                    <svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
+                    </svg>
+                </button>
+            </div>
+            <div class="items-center justify-between hidden w-full lg:flex lg:w-auto lg:order-1" id="mobile-menu-2">
+                <ul class="flex flex-col mt-4 font-medium lg:flex-row lg:space-x-8 lg:mt-0" x-data="{ activeMenu: 'facility' }">
+                    <li>
+                        <a href="{{ URL::to('/') }}" @click="activeMenu='home'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='home'}"
+                           aria-current="page">Home</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#cakupan') }}" @click="activeMenu='cakupan'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='cakupan'}">Cakupan</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#skema') }}" @click="activeMenu='skema'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='skema'}">Skema Kerjasama</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#pendaftaran') }}" @click="activeMenu='pendaftaran'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='pendaftaran'}">Pendaftaran</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('facility') }}" @click="activeMenu='facility'" class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='facility'}">Sequencing Facility</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+</header>
+
+<!-- Start block -->
+<section id="facility" class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto space-y-12 lg:space-y-20 lg:py-24 lg:px-6">
+        <!-- Row -->
+        <div class="items-center">
+            <div class="text-gray-500 sm:text-lg dark:text-gray-400">
+                <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Sequencing Facility</h2>
+                <!-- List -->
+                <div class="w-full mx-auto grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-12 mt-10">
+                    @foreach($facility as $data)
+                        <div class="w-full bg-white border border-gray-200 rounded-lg shadow-sm shadow-guardsman-red-200 dark:bg-gray-800 dark:border-gray-700">
+                            <a href="#">
+                                <img class="rounded-t-lg" src="https://www.ncl.ac.uk/media/wwwnclacuk/genomiccorefacility/images/box-third-hand-2F2A9453.jpg" alt="{{ $data['facility_name'] }}">
+                            </a>
+                            <div class="p-5">
+                                <a href="#">
+                                    <h5 class="mb-2 text-2xl font-bold tracking-tight text-guardsman-red-900 dark:text-white">{{ $data['facility_name'] }}</h5>
+                                </a>
+                                <p class="mb-3 font-normal text-base text-gray-400 dark:text-gray-400">{{ $data['institution'].' '.$data['region'] }}</p>
+                                <p class="mb-4 text-neutral-600 dark:text-neutral-200">
+                                    {{ $data['address'] }}
+                                </p>
+                            </div>
+                        </div>
+                    @endforeach
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+<!-- Start block -->
+<!-- Start block -->
+<section id="pendaftaran" class="bg-mallard-50 dark:bg-mallard-800 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-16 lg:px-6">
+        <div class="max-w-screen-sm mx-auto text-center">
+            <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Instruksi Pendaftaran</h2>
+            <p class="mb-6 font-light text-gray-700 dark:text-gray-600 md:text-lg">Informasi lebih lanjut dapat menghubungi kami melalui
+                <a href="mailto:omics@dharma.or.id" class="text-guardsman-red-600">omics@dharma.or.id</a> atau menghubungi
+                <a href="tel:+620895324832922" class="text-guardsman-red-600">0895-3248-32922 (whatsapp)</a>. Skema ini terus dibuka sesuai dengan ketersediaan dana YSDS.
+            </p>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+
+<!-- Start block -->
+<section class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="items-center max-w-screen-xl px-4 py-6 mx-auto lg:grid lg:grid-cols-4 lg:gap-16 xl:gap-24 lg:px-6">
+        <div class="col-span-2">
+            <h5 class="mt-3 mb-4 text-2xl font-extrabold tracking-tight text-gray-900 md:text-3xl dark:text-white">Catatan Perubahan</h5>
+            <ol class="relative border-l border-guardsman-red-200 dark:border-guardsman-red-700">
+                <li class="ml-4">
+                    18 Juli 2023 : Update informasi kerjasama bahan habis pakai sequencing
+                </li>
+                <li class="ml-4">
+                    01 Mei 2023 : Update informasi kerjasama penelitian genomik 2023
+                </li>
+                <li class="ml-4">
+                    16 November 2022 : Update informasi penutupan pendaftaran hibah
+                </li>
+                <li class="ml-4">
+                    01 November 2022 : Ekstensi deadline hibah dan perubahan timeline hibah
+                </li>
+                <li class="ml-4">
+                    04 Oktober 2022 : Update Dokumen
+                </li>
+                <li class="ml-4">
+                    01 Oktober 2022 : Peluncuran website
+                </li>
+            </ol>
+        </div>
+    </div>
+    <div class="max-w-screen-xl p-4 mx-auto">
+        <hr class="my-6 border-guardsman-red-200 sm:mx-auto dark:border-guardsman-red-700">
+        <div class="text-center">
+                <span class="block text-sm text-center text-gray-500 dark:text-gray-400">© 2022-2023 <a href="https://dharma.or.id" class="text-guardsman-red-600 hover:underline dark:text-guardsman-red-500">Yayasan Satriabudi Dharma Setia</a>
+                </span>
+            <ul class="flex justify-center mt-5 space-x-5">
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c5.51 0 10-4.48 10-10S17.51 2 12 2zm6.605 4.61a8.502 8.502 0 011.93 5.314c-.281-.054-3.101-.629-5.943-.271-.065-.141-.12-.293-.184-.445a25.416 25.416 0 00-.564-1.236c3.145-1.28 4.577-3.124 4.761-3.362zM12 3.475c2.17 0 4.154.813 5.662 2.148-.152.216-1.443 1.941-4.48 3.08-1.399-2.57-2.95-4.675-3.189-5A8.687 8.687 0 0112 3.475zm-3.633.803a53.896 53.896 0 013.167 4.935c-3.992 1.063-7.517 1.04-7.896 1.04a8.581 8.581 0 014.729-5.975zM3.453 12.01v-.26c.37.01 4.512.065 8.775-1.215.25.477.477.965.694 1.453-.109.033-.228.065-.336.098-4.404 1.42-6.747 5.303-6.942 5.629a8.522 8.522 0 01-2.19-5.705zM12 20.547a8.482 8.482 0 01-5.239-1.8c.152-.315 1.888-3.656 6.703-5.337.022-.01.033-.01.054-.022a35.318 35.318 0 011.823 6.475 8.4 8.4 0 01-3.341.684zm4.761-1.465c-.086-.52-.542-3.015-1.659-6.084 2.679-.423 5.022.271 5.314.369a8.468 8.468 0 01-3.655 5.715z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+            </ul>
+        </div>
+    </div>
+</section>
+<script src="https://unpkg.com/flowbite@1.4.1/dist/flowbite.js"></script>
+</body>
+</html>
diff --git a/Resources/views/ic.blade.php b/Resources/views/ic.blade.php
new file mode 100644
index 0000000..bc58a9a
--- /dev/null
+++ b/Resources/views/ic.blade.php
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html class="light">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <title>Pemeriksaan Virus Dengue dan Wolbachia di Kota Cimahi dengan Metode WGS - Persetujuan Penelitian V.1.01 | Kerjasama Penelitian Genomik Panin 2023</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
+    <script>
+        tailwind.config = {
+            darkMode: 'class',
+            important: true,
+            theme: {
+                extend: {
+                    colors: {
+                        'pirate-gold': {  DEFAULT: '#BF9000',  '50': '#FFDE78',  '100': '#FFD963',  '200': '#FFCF3A',  '300': '#FFC512',  '400': '#E8AF00',  '500': '#BF9000',  '600': '#876600',  '700': '#4F3B00',  '800': '#171100',  '900': '#000000'},
+                        'cello': {  DEFAULT: '#203864',  '50': '#6C8FD0',  '100': '#5C83CB',  '200': '#3E6CC1',  '300': '#345BA2',  '400': '#2A4983',  '500': '#203864',  '600': '#122039',  '700': '#05080F',  '800': '#000000',  '900': '#000000'},
+                        'san-marino': {  DEFAULT: '#4873AD',  '50': '#C6D4E7',  '100': '#B7C9E1',  '200': '#9AB3D5',  '300': '#7D9EC9',  '400': '#6188BD',  '500': '#4873AD',  '600': '#385985',  '700': '#273E5E',  '800': '#172436',  '900': '#060A0F'},
+                        'mine-shaft': {  DEFAULT: '#2B2B2B',  '50': '#878787',  '100': '#7D7D7D',  '200': '#686868',  '300': '#545454',  '400': '#3F3F3F',  '500': '#2B2B2B',  '600': '#0F0F0F',  '700': '#000000',  '800': '#000000',  '900': '#000000'},
+                    },
+                    fontFamily: {
+                        popins: ['Poppins', 'sans-serif'],
+                    },
+                }
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div class=" mx-auto font-popins">
+        <nav class="bg-white px-2 sm:px-4 py-4 dark:bg-gray-900 sticky  w-full z-20 top-0 left-0 border-b border-gray-200 dark:border-gray-600" x-data="{ isOpen: false,activeMenu: 'home' }">
+            <div class="container flex flex-wrap justify-center items-center mx-auto"  @keydown.escape="isOpen = false" @click.away="isOpen = false">
+                <a href="{{ URL::to('/') }}" class="flex items-center">
+                    <img src="{{ asset('assets/media/logos/logo.png') }}" class="mr-3 h-6 sm:h-20" alt="Flowbite Logo">
+                </a>
+            </div>
+        </nav>
+        <div class="container mx-auto relative bg-gray-100">
+            <div  class="flex flex-col space-y-12 md:space-y-28 py-20 items-center justify-end w-full bg-white" style="padding: 0px 35px">
+                <script src="https://www.cognitoforms.com/f/seamless.js" data-key="osMhxmcf0E2QmSzDlyjBiQ" data-form="83"></script>
+            </div>
+            <div class="flex flex-col space-y-11 text-center md:items-center justify-end px-10 md:px-36 pt-20 pb-16 bg-cello w-full">
+                <p class="text-xl text-white">© Copyright Yayasan Satriabudi Dharma Setia. 2023</p>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
diff --git a/Resources/views/index.blade.php b/Resources/views/index.blade.php
new file mode 100644
index 0000000..3b876a7
--- /dev/null
+++ b/Resources/views/index.blade.php
@@ -0,0 +1,367 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <link rel="canonical" href="https://genom.dharma.or.id/"/>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Kerjasama Penelitian Genomik Panin 2023</title>
+
+    <!-- Meta SEO -->
+    <meta name="title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta name="description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta name="robots" content="index, follow">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="language" content="English">
+    <meta name="author" content="Yayasan Satriabudi Dharma Setia">
+
+    <!-- Social media share -->
+    <meta property="og:title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta property="og:site_name" content="Yayasan Satriabudi Dharma Setia">
+    <meta property="og:url" content=https://genom.dharma.or.id">
+    <meta property="og:description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta property="og:type" content="">
+    <meta property="og:image" content="{{ asset('Screenshot 2023-08-23 153008.png') }}">
+
+    <!-- Favicon -->
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <link href="./output.css?time=12342" rel="stylesheet">
+
+</head>
+<body>
+<header class="fixed w-full z-10" id="home">
+    <nav class="relative bg-white border-gray-200 py-2.5 dark:bg-mallard-900 shadow-md shadow-mallard-200">
+        <div class="flex flex-wrap items-center justify-between max-w-screen-xl px-4 mx-auto">
+            <a href="#" class="flex items-center">
+                <img src="{{ asset('assets/media/logos/logo.png') }}" class="h-12 mr-3" alt="Yayasan Satriabudi Dharma Setia"/>
+            </a>
+            <div class="flex items-center lg:order-2">
+                <a href="{{ URL::to('peneliti') }}" class="text-white bg-guardsman-red-700 hover:bg-guardsman-red-800 focus:ring-4 focus:ring-guardsman-red-300 font-medium rounded-md text-sm px-4 lg:px-5 py-2 lg:py-2.5 sm:mr-2 lg:mr-0 dark:bg-guardsman-red-600 dark:hover:bg-guardsman-red-700 focus:outline-none dark:focus:ring-guardsman-red-800">Peneliti</a>
+                <button data-collapse-toggle="mobile-menu-2" type="button" class="inline-flex items-center p-2 ml-1 text-sm text-gray-500 rounded-lg lg:hidden hover:bg-mallard-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-mallard-700 dark:focus:ring-gray-600" aria-controls="mobile-menu-2" aria-expanded="false">
+                    <span class="sr-only">Open main menu</span>
+                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path>
+                    </svg>
+                    <svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
+                    </svg>
+                </button>
+            </div>
+            <div class="items-center justify-between hidden w-full lg:flex lg:w-auto lg:order-1" id="mobile-menu-2">
+                <ul class="flex flex-col mt-4 font-medium lg:flex-row lg:space-x-8 lg:mt-0" x-data="{ activeMenu: 'home' }">
+                    <li>
+                        <a href="{{ URL::to('/') }}" @click="activeMenu='home'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='home'}"
+                           aria-current="page">Home</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#cakupan') }}" @click="activeMenu='cakupan'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='cakupan'}">Cakupan</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#skema') }}" @click="activeMenu='skema'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='skema'}">Skema Kerjasama</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#pendaftaran') }}" @click="activeMenu='pendaftaran'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='pendaftaran'}">Pendaftaran</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('facility') }}" @click="activeMenu='facility'" class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-mallard-50 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='facility'}">Sequencing Facility</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+</header>
+
+<!-- Start block -->
+<section class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="grid max-w-screen-xl px-4 pt-20 pb-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12 lg:pt-28">
+        <div class="mr-auto place-self-center lg:col-span-8">
+            <h1 class="max-w-3xl mb-4 text-4xl font-extrabold leading-none tracking-tight md:text-5xl xl:text-6xl dark:text-white">Pengumuman Skema Kerjasama Bahan Habis Pakai Penelitian Genomik Panin 2023</h1>
+            <p class="max-w-3xl mb-6 font-light text-gray-500 lg:mb-8 md:text-lg lg:text-xl dark:text-gray-400">Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai</p>
+        </div>
+        <div class="hidden lg:mt-0 lg:col-span-4 lg:flex">
+            <img src="https://researchoutreach.org/wp-content/uploads/2020/09/shutterstock_1246209082.png" class="object-cover" alt="hero image">
+        </div>
+    </div>
+</section>
+<!-- End block -->
+<!-- Start block -->
+<section class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 pb-8 mx-auto lg:pb-16">
+        <div class="grid grid-cols-2 gap-6 text-gray-500 sm:gap-12 sm:grid-cols-3 lg:grid-cols-6 dark:text-gray-400 text-center">
+            <span class="hidden lg:flex"></span>
+            <span class="hidden lg:flex"></span>
+            <a href="#" class="flex items-center lg:justify-center">
+                <img src="{{ asset('logo-panin.png') }}" alt="">
+            </a>
+            <a href="#" class="flex items-center lg:justify-center">
+                <img src="{{ asset('logo-marves.jpg') }}" alt="">
+            </a>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+<!-- Start block -->
+<section id="cakupan" class="bg-mallard-50 dark:bg-mallard-800 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-24 lg:px-6">
+        <div class="max-w-screen-md mx-auto mb-4 text-center lg:mb-8">
+            <h2 class="mb-2 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Cakupan Kerjasama Bahan Habis Pakai</h2>
+        </div>
+        <div class="space-y-8 justify-center">
+            <!-- Pricing Card -->
+            <table class="w-full text-lg text-left text-gray-700 dark:text-gray-400">
+                <thead class="text-lg text-gray-800 uppercase bg-gray-100 dark:bg-gray-800 dark:text-gray-400">
+                <tr>
+                    <th scope="col" class="px-6 py-3">Nomor</th>
+                    <th scope="col" class="px-6 py-3">Platform</th>
+                    <th scope="col" class="px-6 py-3">Kategori</th>
+                    <th scope="col" class="px-6 py-3">Nama</th>
+                    <th scope="col" class="px-6 py-3">Harga</th>
+                </tr>
+                </thead>
+                <tbody>
+                @php $no=1; @endphp
+                @foreach($platform as $row)
+                    <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
+                        <td class="px-6 py-4">{{ $no }}</td>
+                        <td class="px-6 py-4">{{ $row['Platform'] }}</td>
+                        <td class="px-6 py-4">{{ $row['Kategori'] }}</td>
+                        <td class="px-6 py-4">{{ $row['Nama'] }}
+                            <br><em class="text-sm">Kode Unit : {{ $row['Kode Unit'] }}</em></td>
+                        @php
+                            $harga = str_replace('$','',$row['Harga']);
+                            $harga = str_replace('.00','',$harga);
+                            $harga = str_replace(',','',$harga);
+                        @endphp
+                        <td class="px-6 py-4">Rp {{ number_format($harga*($usd+($usd*0.05)),2,',','.') }}</td>
+                    </tr>
+                    @php $no++; @endphp
+                @endforeach
+                </tbody>
+            </table>
+            <em style="float:right;color:red;"><a href="{{ URL::to('cakupan') }}">Lihat Lebih Banyak</a></em><br>
+            <em>Kurs Dolar Tanggal {{ $date }} Rp. Rp {{ number_format($usd,2,',','.') }}</em><br>
+            <em>Kurs Dolar dapat berubah sewaktu-waktu</em>
+            <br> <br>
+            <em class="text-sm">Harga belum termasuk :</em> <br>
+            <em class="text-sm">1. Bea masuk, PPH, dan PPN sekitar 15-20% dari harga dasar barang,</em> <br>
+            <em class="text-sm">2. Ongkos kirim dengan estimasi Rp. 500.000 - 1.500.000 per pengiriman per kg,</em> <br>
+            <em class="text-sm">3. Administrasi, penanganan dan penyimpanan barang yang berkisar 5% dari harga dasar barang.</em>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+
+<!-- Start block -->
+<section id="skema" class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto space-y-12 lg:space-y-20 lg:py-24 lg:px-6">
+        <!-- Row -->
+        <div class="items-center gap-8 lg:grid lg:grid-cols-2 xl:gap-16">
+            <div class="text-gray-500 sm:text-lg dark:text-gray-400">
+                <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Skema Kerjasama Penelitian Untuk Pengadaan Bahan Habis Pakai Sequencing</h2>
+                <!-- List -->
+                <ul role="list" class="pt-8 space-y-5 border-t border-gray-200 my-7 dark:border-gray-700">
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">YSDS akan memfasilitasi pengadaan bahan habis pakai dengan harga sesuai pada daftar 1</span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">Pemesanan bahan habis pakai dilakukan dengan mengisi formulir <a href="https://www.cognitoforms.com/YayasanSatriabudiDharma/FormulirKerjasamaReagenPenelitian" class="text-guardsman-red-500" target="_blank">berikut.</a></span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">Petugas YSDS akan mengontak calon pemesan dalam waktu 1-3 hari kerja untuk konfirmasi pemesanan dan pengiriman bahan habis pakai ke lokasi peneliti.</span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">Bahan habis pakai hanya dapat digunakan untuk keperluan penelitian dan tidak dapat diperjualbelikan kembali.</span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">Informasi terkait pemesanan bahan habis pakai dapat menghubungi Bapak Heppy di nomor 0896-0298-2179.</span>
+                    </li>
+                </ul>
+            </div>
+            <img class="hidden w-full mb-4 rounded-lg lg:mb-0 lg:flex" src="https://media.istockphoto.com/id/1303707094/vector/businessman-signing-contract-with-digital-pen-on-phone-digital-signature-business-contract.jpg?s=612x612&w=0&k=20&c=1OpMd1324OfOi7fvd73eJdo63FFsenhKkST9_rdvhbY=" alt="dashboard feature image">
+        </div>
+        <!-- Row -->
+        <hr class="border-guardsman-red-200 sm:mx-auto dark:border-guardsman-red-700">
+        <div class="items-center gap-8 lg:grid lg:grid-cols-2 xl:gap-16">
+            <img class="hidden w-full mb-4 rounded-lg lg:mb-0 lg:flex" src="https://www.consensusdocs.org/wp-content/uploads/2022/07/contract-graphic.png" alt="feature image 2">
+            <div class="text-gray-500 sm:text-lg dark:text-gray-400">
+                <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Skema Kerjasama Penelitian Sequencing</h2>
+                <!-- List -->
+                <ul role="list" class="pt-8 space-y-5 border-t border-gray-200 my-7 dark:border-gray-700">
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">YSDS akan memfasilitasi pemeriksaan genome sequencing mulai dari proses library preparation hingga dihasilkan data sequencing (meliputi jasa pemeriksaan dan bahan habis pakai untuk proses tersebut dan analisis bioinformatika) di laboratorium yang sudah didukung oleh YSDS. <a href="{{ URL::to('facility') }}" class="text-guardsman-red-500">Daftar Laboratorium.</a></span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">Data yang dihasilkan dari pemeriksaan genome sequencing akan dikumpulkan untuk membangun repositori data genomik nasional yang dapat diakses oleh berbagai peneliti di Indonesia melalui institusi penelitian yang sudah bekerjasama dengan YSDS.</span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">Untuk mengikuti skema ini, peneliti dapat mengirim proposal dengan mengirim email ke  <a href="mailto:omics@dharma.or.id" class="text-guardsman-red-600">omics@dharma.or.id</a>, meliputi Proposal penelitian dengan format  <a href="https://docs.google.com/document/d/1SWIyYidFh72NhaVtOFEYe9WeGrjZMXyDohq_XUyVlR4/edit" class="text-guardsman-red-500" target="_blank">berikut.</a></span>
+                </ul>
+            </div>
+        </div>
+        <!-- Row -->
+        <hr class="border-guardsman-red-200 sm:mx-auto dark:border-guardsman-red-700">
+        <div class="items-center gap-8 lg:grid lg:grid-cols-2 xl:gap-16">
+            <div class="text-gray-500 sm:text-lg dark:text-gray-400">
+                <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">Skema Kerjasama Peminjaman Alat Genome Sequencing untuk Laboratorium Institusi Penelitian</h2>
+                <p class="text-lg border-t border-gray-200 my-7 dark:border-gray-700 pt-8">YSDS akan menempatkan alat genome sequencing di Institusi penelitian dengan kebutuhan pemeriksaan genome sequencing yang kontinu. Institusi penelitian diharapkan dapat menggunakan alat semaksimal mungkin dengan membuka seluas-luasnya akses penggunaan alat tersebut kepada civitas Institusi atau peneliti/Institusi lain. Jenis alat yang disediakan oleh YSDS mencakup:</p>
+                <!-- List -->
+                <ul role="list" class="space-y-5">
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">PromethION 2 Sequencing Unit Solo dari penyedia Oxford Nanopore Technologies (ONT). Informasi lengkap alat: <a href="https://store.nanoporetech.com/eu/p2-solo.html" class="text-guardsman-red-500" target="_blank">https://store.nanoporetech.com/eu/p2-solo.html</a></span>
+                    </li>
+                    <li class="flex space-x-3">
+                        <!-- Icon -->
+                        <svg class="flex-shrink-0 w-5 h-5 text-guardsman-red-500 dark:text-guardsman-red-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                            <path fill-rule="evenodd" d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z" clip-rule="evenodd"></path>
+                        </svg>
+                        <span class="text-lg font-medium leading-tight text-gray-900 dark:text-white">MinION Mk1B dari penyedia Oxford Nanopore Technologies (ONT). Informasi lengkap alat: <a href="https://store.nanoporetech.com/eu/minion.html" class="text-guardsman-red-500" target="_blank">https://store.nanoporetech.com/eu/minion.html</a></span>
+                    </li>
+                </ul>
+                <p class="text-lg pt-8">Jenis alat yang disediakan menyesuaikan dengan stok yang ada dan dapat berganti sesuai dengan perkembangan kerjasama YSDS dengan penyedia alat genome sequencing.</p>
+            </div>
+            <img class="hidden w-full mb-4 rounded-lg lg:mb-0 lg:flex" src="{{ asset('istockphoto-1336808150-612x612.jpg') }}" alt="Skema Kerjasama Peminjaman Alat Genome Sequencing untuk Laboratorium Institusi Penelitian">
+        </div>
+    </div>
+</section>
+<!-- End block -->
+<!-- Start block -->
+<section id="pendaftaran" class="bg-mallard-50 dark:bg-mallard-800 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-16 lg:px-6">
+        <div class="max-w-screen-sm mx-auto text-center">
+            <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Instruksi Pendaftaran</h2>
+            <p class="mb-6 font-light text-gray-700 dark:text-gray-600 md:text-lg">Informasi lebih lanjut dapat menghubungi kami melalui
+                <a href="mailto:omics@dharma.or.id" class="text-guardsman-red-600">omics@dharma.or.id</a> atau menghubungi
+                <a href="tel:+620895324832922" class="text-guardsman-red-600">0895-3248-32922 (whatsapp)</a>. Skema ini terus dibuka sesuai dengan ketersediaan dana YSDS.
+            </p>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+
+<!-- Start block -->
+<section class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="items-center max-w-screen-xl px-4 py-6 mx-auto lg:grid lg:grid-cols-4 lg:gap-16 xl:gap-24 lg:px-6">
+        <div class="col-span-2">
+            <h5 class="mt-3 mb-4 text-2xl font-extrabold tracking-tight text-gray-900 md:text-3xl dark:text-white">Catatan Perubahan</h5>
+            <ol class="relative border-l border-guardsman-red-200 dark:border-guardsman-red-700">
+                <li class="ml-4">
+                    18 Juli 2023 : Update informasi kerjasama bahan habis pakai sequencing
+                </li>
+                <li class="ml-4">
+                    01 Mei 2023 : Update informasi kerjasama penelitian genomik 2023
+                </li>
+                <li class="ml-4">
+                    16 November 2022 : Update informasi penutupan pendaftaran hibah
+                </li>
+                <li class="ml-4">
+                    01 November 2022 : Ekstensi deadline hibah dan perubahan timeline hibah
+                </li>
+                <li class="ml-4">
+                    04 Oktober 2022 : Update Dokumen
+                </li>
+                <li class="ml-4">
+                    01 Oktober 2022 : Peluncuran website
+                </li>
+            </ol>
+        </div>
+    </div>
+    <div class="max-w-screen-xl p-4 mx-auto">
+        <hr class="my-6 border-guardsman-red-200 sm:mx-auto dark:border-guardsman-red-700">
+        <div class="text-center">
+                <span class="block text-sm text-center text-gray-500 dark:text-gray-400">© 2022-2023 <a href="https://dharma.or.id" class="text-guardsman-red-600 hover:underline dark:text-guardsman-red-500">Yayasan Satriabudi Dharma Setia</a>
+                </span>
+            <ul class="flex justify-center mt-5 space-x-5">
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c5.51 0 10-4.48 10-10S17.51 2 12 2zm6.605 4.61a8.502 8.502 0 011.93 5.314c-.281-.054-3.101-.629-5.943-.271-.065-.141-.12-.293-.184-.445a25.416 25.416 0 00-.564-1.236c3.145-1.28 4.577-3.124 4.761-3.362zM12 3.475c2.17 0 4.154.813 5.662 2.148-.152.216-1.443 1.941-4.48 3.08-1.399-2.57-2.95-4.675-3.189-5A8.687 8.687 0 0112 3.475zm-3.633.803a53.896 53.896 0 013.167 4.935c-3.992 1.063-7.517 1.04-7.896 1.04a8.581 8.581 0 014.729-5.975zM3.453 12.01v-.26c.37.01 4.512.065 8.775-1.215.25.477.477.965.694 1.453-.109.033-.228.065-.336.098-4.404 1.42-6.747 5.303-6.942 5.629a8.522 8.522 0 01-2.19-5.705zM12 20.547a8.482 8.482 0 01-5.239-1.8c.152-.315 1.888-3.656 6.703-5.337.022-.01.033-.01.054-.022a35.318 35.318 0 011.823 6.475 8.4 8.4 0 01-3.341.684zm4.761-1.465c-.086-.52-.542-3.015-1.659-6.084 2.679-.423 5.022.271 5.314.369a8.468 8.468 0 01-3.655 5.715z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+            </ul>
+        </div>
+    </div>
+</section>
+<script src="https://unpkg.com/flowbite@1.4.1/dist/flowbite.js"></script>
+</body>
+</html>
diff --git a/Resources/views/kuisioner.blade.php b/Resources/views/kuisioner.blade.php
new file mode 100644
index 0000000..7230060
--- /dev/null
+++ b/Resources/views/kuisioner.blade.php
@@ -0,0 +1,61 @@
+<!DOCTYPE html>
+<html class="light">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <title>Kuisioner | Kerjasama Penelitian Genomik Panin 2023</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600&display=swap" rel="stylesheet">
+    <script>
+        tailwind.config = {
+            darkMode: 'class',
+            important: true,
+            theme: {
+                extend: {
+                    colors: {
+                        'pirate-gold': {  DEFAULT: '#BF9000',  '50': '#FFDE78',  '100': '#FFD963',  '200': '#FFCF3A',  '300': '#FFC512',  '400': '#E8AF00',  '500': '#BF9000',  '600': '#876600',  '700': '#4F3B00',  '800': '#171100',  '900': '#000000'},
+                        'cello': {  DEFAULT: '#203864',  '50': '#6C8FD0',  '100': '#5C83CB',  '200': '#3E6CC1',  '300': '#345BA2',  '400': '#2A4983',  '500': '#203864',  '600': '#122039',  '700': '#05080F',  '800': '#000000',  '900': '#000000'},
+                        'san-marino': {  DEFAULT: '#4873AD',  '50': '#C6D4E7',  '100': '#B7C9E1',  '200': '#9AB3D5',  '300': '#7D9EC9',  '400': '#6188BD',  '500': '#4873AD',  '600': '#385985',  '700': '#273E5E',  '800': '#172436',  '900': '#060A0F'},
+                        'mine-shaft': {  DEFAULT: '#2B2B2B',  '50': '#878787',  '100': '#7D7D7D',  '200': '#686868',  '300': '#545454',  '400': '#3F3F3F',  '500': '#2B2B2B',  '600': '#0F0F0F',  '700': '#000000',  '800': '#000000',  '900': '#000000'},
+                    },
+                    fontFamily: {
+                        popins: ['Poppins', 'sans-serif'],
+                    },
+                }
+            }
+        }
+    </script>
+</head>
+
+<body>
+    <div class=" mx-auto font-popins">
+        <nav class="bg-white px-2 sm:px-4 py-4 dark:bg-gray-900 sticky  w-full z-20 top-0 left-0 border-b border-gray-200 dark:border-gray-600" x-data="{ isOpen: false,activeMenu: 'home' }">
+            <div class="container flex flex-wrap justify-center items-center mx-auto"  @keydown.escape="isOpen = false" @click.away="isOpen = false">
+                <a href="{{ URL::to('/') }}" class="flex items-center">
+                    <img src="{{ asset('assets/media/logos/logo.png') }}" class="mr-3 h-6 sm:h-20" alt="Flowbite Logo">
+                </a>
+            </div>
+        </nav>
+        <div class="container mx-auto relative bg-gray-100">
+            <div  class="flex flex-col space-y-12 md:space-y-28 py-20 items-center justify-end w-full bg-white">
+                <script src="https://www.cognitoforms.com/f/seamless.js" data-key="osMhxmcf0E2QmSzDlyjBiQ" data-form="75"></script>
+            </div>
+            <div class="flex flex-col space-y-11 text-center md:items-center justify-end px-10 md:px-36 pt-20 pb-16 bg-cello w-full">
+                <p class="text-xl text-white">© Copyright Yayasan Satriabudi Dharma Setia. 2023</p>
+            </div>
+        </div>
+    </div>
+</body>
+
+</html>
diff --git a/Resources/views/layouts/master.blade.php b/Resources/views/layouts/master.blade.php
new file mode 100644
index 0000000..cdbd963
--- /dev/null
+++ b/Resources/views/layouts/master.blade.php
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang="en">
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <meta name="viewport" content="width=device-width, initial-scale=1">
+        <title>Module Frontend</title>
+
+       {{-- Laravel Vite - CSS File --}}
+       {{-- {{ module_vite('build-frontend', 'Resources/assets/sass/app.scss') }} --}}
+
+    </head>
+    <body>
+        @yield('content')
+
+        {{-- Laravel Vite - JS File --}}
+        {{-- {{ module_vite('build-frontend', 'Resources/assets/js/app.js') }} --}}
+    </body>
+</html>
diff --git a/Resources/views/peneliti.blade.php b/Resources/views/peneliti.blade.php
new file mode 100644
index 0000000..1d43ac9
--- /dev/null
+++ b/Resources/views/peneliti.blade.php
@@ -0,0 +1,241 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <link rel="canonical" href="https://genom.dharma.or.id/"/>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Kerjasama Penelitian Genomik Panin 2023</title>
+
+    <!-- Meta SEO -->
+    <meta name="title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta name="description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta name="robots" content="index, follow">
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
+    <meta name="language" content="English">
+    <meta name="author" content="Yayasan Satriabudi Dharma Setia">
+
+    <!-- Social media share -->
+    <meta property="og:title" content="Kerjasama Penelitian Genomik Panin 2023">
+    <meta property="og:site_name" content="Yayasan Satriabudi Dharma Setia">
+    <meta property="og:url" content=https://genom.dharma.or.id">
+    <meta property="og:description" content="Yayasan Satriabudi Dharma Setia (YSDS) mengundang peneliti-peneliti Indonesia yang memiliki penelitian dengan metode pemeriksaan genome sequencing, untuk dapat menggunakan fasilitas kerjasama bahan habis pakai">
+    <meta property="og:type" content="">
+    <meta property="og:image" content="{{ asset('Screenshot 2023-08-23 153008.png') }}">
+
+    <!-- Favicon -->
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset('favicon/apple-touch-icon.png') }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset('favicon/favicon-32x32.png') }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('favicon/favicon-16x16.png') }}">
+    <link rel="manifest" href="{{ asset('favicon/site.webmanifest') }}">
+    <link rel="mask-icon" href="{{ asset('favicon/safari-pinned-tab.svg') }}" color="#5bbad5">
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
+    <meta name="msapplication-TileColor" content="#da532c">
+    <meta name="theme-color" content="#ffffff">
+    <link href="{{ URL::to('output.css') }}" rel="stylesheet">
+
+</head>
+<body>
+<header class="fixed w-full z-10" id="home">
+    <nav class="relative bg-white border-gray-200 py-2.5 dark:bg-mallard-900 shadow-md shadow-mallard-200">
+        <div class="flex flex-wrap items-center justify-between max-w-screen-xl px-4 mx-auto">
+            <a href="#" class="flex items-center">
+                <img src="{{ asset('assets/media/logos/logo.png') }}" class="h-12 mr-3" alt="Yayasan Satriabudi Dharma Setia"/>
+            </a>
+            <div class="flex items-center lg:order-2">
+                <a href="{{ URL::to('peneliti') }}" class="text-white bg-guardsman-red-700 hover:bg-guardsman-red-800 focus:ring-4 focus:ring-guardsman-red-300 font-medium rounded-md text-sm px-4 lg:px-5 py-2 lg:py-2.5 sm:mr-2 lg:mr-0 dark:bg-guardsman-red-600 dark:hover:bg-guardsman-red-700 focus:outline-none dark:focus:ring-guardsman-red-800">Peneliti</a>
+                <button data-collapse-toggle="mobile-menu-2" type="button" class="inline-flex items-center p-2 ml-1 text-sm text-gray-500 rounded-lg lg:hidden hover:bg-mallard-100 focus:outline-none focus:ring-2 focus:ring-gray-200 dark:text-gray-400 dark:hover:bg-mallard-700 dark:focus:ring-gray-600" aria-controls="mobile-menu-2" aria-expanded="false">
+                    <span class="sr-only">Open main menu</span>
+                    <svg class="w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M3 5a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 10a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1zM3 15a1 1 0 011-1h12a1 1 0 110 2H4a1 1 0 01-1-1z" clip-rule="evenodd"></path>
+                    </svg>
+                    <svg class="hidden w-6 h-6" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg">
+                        <path fill-rule="evenodd" d="M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z" clip-rule="evenodd"></path>
+                    </svg>
+                </button>
+            </div>
+            <div class="items-center justify-between hidden w-full lg:flex lg:w-auto lg:order-1" id="mobile-menu-2">
+                <ul class="flex flex-col mt-4 font-medium lg:flex-row lg:space-x-8 lg:mt-0" x-data="{ activeMenu: 'home' }">
+                    <li>
+                        <a href="{{ URL::to('/') }}" @click="activeMenu='home'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-guardsman-red-200 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='home'}"
+                           aria-current="page">Home</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#cakupan') }}" @click="activeMenu='cakupan'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-guardsman-red-200 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='cakupan'}">Cakupan</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#skema') }}" @click="activeMenu='cakupan'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-guardsman-red-200 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='skema'}">Skema Kerjasama</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('/#pendaftaran') }}" @click="activeMenu='cakupan'"
+                           class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-guardsman-red-200 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='pendaftaran'}">Pendaftaran</a>
+                    </li>
+                    <li>
+                        <a href="{{ URL::to('facility') }}" @click="activeMenu='facility'" class="block py-2 pl-3 pr-4 text-gray-700 border-b border-gray-100 hover:bg-guardsman-red-200 lg:hover:bg-transparent lg:border-0 lg:hover:text-guardsman-red-700 lg:p-0 dark:text-gray-400 lg:dark:hover:text-white dark:hover:bg-mallard-700 dark:hover:text-white lg:dark:hover:bg-transparent dark:border-gray-700"
+                           :class="{'text-white bg-guardsman-red-700 rounded lg:bg-transparent lg:text-guardsman-red-700 dark:text-white' : activeMenu=='facility'}">Sequencing Facility</a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </nav>
+</header>
+
+<!-- Start block -->
+<section id="facility" class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto space-y-12 lg:space-y-20 lg:py-24 lg:px-6">
+        <!-- Row -->
+        <div class="items-center">
+            <div class="text-gray-500 sm:text-lg dark:text-gray-400">
+                <h2 class="mb-4 text-3xl font-extrabold tracking-tight text-gray-900 dark:text-white">List Peneliti</h2>
+                <!-- List -->
+                <div class="w-full mx-auto grid gird-cols-1 lg:grid-cols-2 gap-8 mt-10">
+                    @foreach($researcher as $data)
+                    <div class="bg-white relative block overflow-hidden rounded-lg shadow-sm shadow-pirate-gold-200 border border-gray-100 p-4 w-full">
+                        <span class="absolute inset-x-0 bottom-0 h-2 bg-gradient-to-r from-mallard-300 via-cello-500 to-guardsman-red-600"></span>
+                        <div class="justify-between sm:flex">
+                            <div>
+                                <h3 class="text-xl font-bold text-gray-900">
+                                    {{ $data['reseracher_name'] }}
+                                </h3>
+
+                                <p class="mt-1 text-xs font-medium text-gray-600">{{ $data['email'] }}</p>
+                            </div>
+                            <div class="ml-3 flex-shrink-0">
+                                <span class="h-16 w-16 bg-san-marino-50 text-2xl text-guardsman-red font-bold rounded-lg object-cover shadow-sm bg-guardsman-red-200 flex items-center justify-center">{{ $data['no'] }}</span>
+                            </div>
+                        </div>
+                        <div class="mt-2 sm:pr-8">
+                            <p class="text-lg text-gray-500">
+                                {{ $data['research_title'] }}
+                            </p>
+                        </div>
+                        <dl class="mt-6 flex">
+                            <div class="flex flex-col-reverse">
+                                <dt class="text-sm font-medium text-gray-600">{{ $data['region'] }}</dt>
+                                <dd class="text-xs text-gray-500">{{ $data['institution'] }}</dd>
+                            </div>
+
+                            <div class="ml-3 flex flex-col-reverse sm:ml-6">
+                                <dt class="text-sm font-medium text-gray-600">{{ $data['registration_date'] }}</dt>
+                                <dd class="text-xs text-gray-500">Registration Date</dd>
+                            </div>
+                        </dl>
+                    </div>
+                    @endforeach
+                </div>
+            </div>
+        </div>
+    </div>
+</section>
+<!-- End block -->
+<!-- Start block -->
+<section class="bg-mallard-50 dark:bg-mallard-800 px-5 md:px-0">
+    <div class="items-center max-w-screen-xl px-4 py-8 mx-auto lg:grid lg:grid-cols-4 lg:gap-16 xl:gap-24 lg:py-24 lg:px-6">
+        <div class="col-span-2 mb-8">
+            <h2 class="mt-3 mb-4 text-3xl font-extrabold tracking-tight text-gray-900 md:text-3xl dark:text-white">Catatan Perubahan</h2>
+
+            <ol class="relative border-l border-guardsman-red-200 dark:border-guardsman-red-700">
+                <li class="mb-10 ml-4">
+                    <div class="absolute w-3 h-3 bg-guardsman-red-500 rounded-full mt-1.5 -left-1.5 border border-white dark:border-guardsman-red-900 dark:bg-guardsman-red-700"></div>
+                    <time class="mb-1 text-sm font-normal leading-none text-guardsman-red-400 dark:text-guardsman-red-500">18 Juli 2023</time>
+                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Update informasi kerjasama bahan habis pakai sequencing</h3>
+                </li>
+                <li class="mb-10 ml-4">
+                    <div class="absolute w-3 h-3 bg-guardsman-red-500 rounded-full mt-1.5 -left-1.5 border border-white dark:border-guardsman-red-900 dark:bg-guardsman-red-700"></div>
+                    <time class="mb-1 text-sm font-normal leading-none text-guardsman-red-400 dark:text-guardsman-red-500">01 Mei 2023</time>
+                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Update informasi kerjasama penelitian genomik 2023</h3>
+                </li>
+                <li class="mb-10 ml-4">
+                    <div class="absolute w-3 h-3 bg-guardsman-red-500 rounded-full mt-1.5 -left-1.5 border border-white dark:border-guardsman-red-900 dark:bg-guardsman-red-700"></div>
+                    <time class="mb-1 text-sm font-normal leading-none text-guardsman-red-400 dark:text-guardsman-red-500">16 November 2022</time>
+                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Update informasi penutupan pendaftaran hibah</h3>
+                </li>
+                <li class="mb-10 ml-4">
+                    <div class="absolute w-3 h-3 bg-guardsman-red-500 rounded-full mt-1.5 -left-1.5 border border-white dark:border-guardsman-red-900 dark:bg-guardsman-red-700"></div>
+                    <time class="mb-1 text-sm font-normal leading-none text-guardsman-red-400 dark:text-guardsman-red-500">01 November 2022</time>
+                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Ekstensi deadline hibah dan perubahan timeline hibah</h3>
+                </li>
+                <li class="mb-10 ml-4">
+                    <div class="absolute w-3 h-3 bg-guardsman-red-500 rounded-full mt-1.5 -left-1.5 border border-white dark:border-guardsman-red-900 dark:bg-guardsman-red-700"></div>
+                    <time class="mb-1 text-sm font-normal leading-none text-guardsman-red-400 dark:text-guardsman-red-500">04 Oktober 2022</time>
+                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Update Dokumen</h3>
+                    <p class="mb-4 text-base font-normal text-gray-500 dark:text-gray-400">Update dokumen ketentuan teknis hibah, format proposal, format RAB, dan format slide presentasi</p>
+                </li>
+                <li class="mb-10 ml-4">
+                    <div class="absolute w-3 h-3 bg-guardsman-red-500 rounded-full mt-1.5 -left-1.5 border border-white dark:border-guardsman-red-900 dark:bg-guardsman-red-700"></div>
+                    <time class="mb-1 text-sm font-normal leading-none text-guardsman-red-400 dark:text-guardsman-red-500">01 Oktober 2022</time>
+                    <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Peluncuran website</h3>
+                </li>
+            </ol>
+
+        </div>
+    </div>
+</section>
+<!-- End block -->
+
+<!-- Start block -->
+<section id="pendaftaran" class="bg-white dark:bg-mallard-900 px-5 md:px-0">
+    <div class="max-w-screen-xl px-4 py-8 mx-auto lg:py-16 lg:px-6">
+        <div class="max-w-screen-sm mx-auto text-center">
+            <h2 class="mb-4 text-3xl font-extrabold leading-tight tracking-tight text-gray-900 dark:text-white">Instruksi Pendaftaran</h2>
+            <p class="mb-6 font-light text-gray-700 dark:text-gray-600 md:text-lg">Informasi lebih lanjut dapat menghubungi kami melalui
+                <a href="mailto:omics@dharma.or.id" class="text-guardsman-red-600">omics@dharma.or.id</a> atau menghubungi
+                <a href="tel:+620895324832922" class="text-guardsman-red-600">0895-3248-32922 (whatsapp)</a>. Skema ini terus dibuka sesuai dengan ketersediaan dana YSDS.
+            </p>
+        </div>
+    </div>
+    <div class="max-w-screen-xl p-4 py-6 mx-auto lg:py-16 md:p-8 lg:p-10">
+        <hr class="my-6 border-guardsman-red-200 sm:mx-auto dark:border-guardsman-red-700 lg:my-8">
+        <div class="text-center">
+                <span class="block text-sm text-center text-gray-500 dark:text-gray-400">© 2022-2023 <a href="https://dharma.or.id" class="text-guardsman-red-600 hover:underline dark:text-guardsman-red-500">Yayasan Satriabudi Dharma Setia</a>
+                </span>
+            <ul class="flex justify-center mt-5 space-x-5">
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M22 12c0-5.523-4.477-10-10-10S2 6.477 2 12c0 4.991 3.657 9.128 8.438 9.878v-6.987h-2.54V12h2.54V9.797c0-2.506 1.492-3.89 3.777-3.89 1.094 0 2.238.195 2.238.195v2.46h-1.26c-1.243 0-1.63.771-1.63 1.562V12h2.773l-.443 2.89h-2.33v6.988C18.343 21.128 22 16.991 22 12z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12.315 2c2.43 0 2.784.013 3.808.06 1.064.049 1.791.218 2.427.465a4.902 4.902 0 011.772 1.153 4.902 4.902 0 011.153 1.772c.247.636.416 1.363.465 2.427.048 1.067.06 1.407.06 4.123v.08c0 2.643-.012 2.987-.06 4.043-.049 1.064-.218 1.791-.465 2.427a4.902 4.902 0 01-1.153 1.772 4.902 4.902 0 01-1.772 1.153c-.636.247-1.363.416-2.427.465-1.067.048-1.407.06-4.123.06h-.08c-2.643 0-2.987-.012-4.043-.06-1.064-.049-1.791-.218-2.427-.465a4.902 4.902 0 01-1.772-1.153 4.902 4.902 0 01-1.153-1.772c-.247-.636-.416-1.363-.465-2.427-.047-1.024-.06-1.379-.06-3.808v-.63c0-2.43.013-2.784.06-3.808.049-1.064.218-1.791.465-2.427a4.902 4.902 0 011.153-1.772A4.902 4.902 0 015.45 2.525c.636-.247 1.363-.416 2.427-.465C8.901 2.013 9.256 2 11.685 2h.63zm-.081 1.802h-.468c-2.456 0-2.784.011-3.807.058-.975.045-1.504.207-1.857.344-.467.182-.8.398-1.15.748-.35.35-.566.683-.748 1.15-.137.353-.3.882-.344 1.857-.047 1.023-.058 1.351-.058 3.807v.468c0 2.456.011 2.784.058 3.807.045.975.207 1.504.344 1.857.182.466.399.8.748 1.15.35.35.683.566 1.15.748.353.137.882.3 1.857.344 1.054.048 1.37.058 4.041.058h.08c2.597 0 2.917-.01 3.96-.058.976-.045 1.505-.207 1.858-.344.466-.182.8-.398 1.15-.748.35-.35.566-.683.748-1.15.137-.353.3-.882.344-1.857.048-1.055.058-1.37.058-4.041v-.08c0-2.597-.01-2.917-.058-3.96-.045-.976-.207-1.505-.344-1.858a3.097 3.097 0 00-.748-1.15 3.098 3.098 0 00-1.15-.748c-.353-.137-.882-.3-1.857-.344-1.023-.047-1.351-.058-3.807-.058zM12 6.865a5.135 5.135 0 110 10.27 5.135 5.135 0 010-10.27zm0 1.802a3.333 3.333 0 100 6.666 3.333 3.333 0 000-6.666zm5.338-3.205a1.2 1.2 0 110 2.4 1.2 1.2 0 010-2.4z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.477 2 2 6.484 2 12.017c0 4.425 2.865 8.18 6.839 9.504.5.092.682-.217.682-.483 0-.237-.008-.868-.013-1.703-2.782.605-3.369-1.343-3.369-1.343-.454-1.158-1.11-1.466-1.11-1.466-.908-.62.069-.608.069-.608 1.003.07 1.531 1.032 1.531 1.032.892 1.53 2.341 1.088 2.91.832.092-.647.35-1.088.636-1.338-2.22-.253-4.555-1.113-4.555-4.951 0-1.093.39-1.988 1.029-2.688-.103-.253-.446-1.272.098-2.65 0 0 .84-.27 2.75 1.026A9.564 9.564 0 0112 6.844c.85.004 1.705.115 2.504.337 1.909-1.296 2.747-1.027 2.747-1.027.546 1.379.202 2.398.1 2.651.64.7 1.028 1.595 1.028 2.688 0 3.848-2.339 4.695-4.566 4.943.359.309.678.92.678 1.855 0 1.338-.012 2.419-.012 2.747 0 .268.18.58.688.482A10.019 10.019 0 0022 12.017C22 6.484 17.522 2 12 2z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+                <li>
+                    <a href="#" class="text-gray-500 hover:text-gray-900 dark:hover:text-white dark:text-gray-400">
+                        <svg class="w-5 h-5" fill="currentColor" viewBox="0 0 24 24" aria-hidden="true">
+                            <path fill-rule="evenodd" d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10c5.51 0 10-4.48 10-10S17.51 2 12 2zm6.605 4.61a8.502 8.502 0 011.93 5.314c-.281-.054-3.101-.629-5.943-.271-.065-.141-.12-.293-.184-.445a25.416 25.416 0 00-.564-1.236c3.145-1.28 4.577-3.124 4.761-3.362zM12 3.475c2.17 0 4.154.813 5.662 2.148-.152.216-1.443 1.941-4.48 3.08-1.399-2.57-2.95-4.675-3.189-5A8.687 8.687 0 0112 3.475zm-3.633.803a53.896 53.896 0 013.167 4.935c-3.992 1.063-7.517 1.04-7.896 1.04a8.581 8.581 0 014.729-5.975zM3.453 12.01v-.26c.37.01 4.512.065 8.775-1.215.25.477.477.965.694 1.453-.109.033-.228.065-.336.098-4.404 1.42-6.747 5.303-6.942 5.629a8.522 8.522 0 01-2.19-5.705zM12 20.547a8.482 8.482 0 01-5.239-1.8c.152-.315 1.888-3.656 6.703-5.337.022-.01.033-.01.054-.022a35.318 35.318 0 011.823 6.475 8.4 8.4 0 01-3.341.684zm4.761-1.465c-.086-.52-.542-3.015-1.659-6.084 2.679-.423 5.022.271 5.314.369a8.468 8.468 0 01-3.655 5.715z" clip-rule="evenodd"/>
+                        </svg>
+                    </a>
+                </li>
+            </ul>
+        </div>
+    </div>
+</section>
+<script src="https://unpkg.com/flowbite@1.4.1/dist/flowbite.js"></script>
+</body>
+</html>
diff --git a/Routes/.gitkeep b/Routes/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Routes/api.php b/Routes/api.php
new file mode 100644
index 0000000..3015f1d
--- /dev/null
+++ b/Routes/api.php
@@ -0,0 +1,18 @@
+<?php
+
+use Illuminate\Http\Request;
+
+/*
+|--------------------------------------------------------------------------
+| API Routes
+|--------------------------------------------------------------------------
+|
+| Here is where you can register API routes for your application. These
+| routes are loaded by the RouteServiceProvider within a group which
+| is assigned the "api" middleware group. Enjoy building your API!
+|
+*/
+
+Route::middleware('auth:api')->get('/frontend', function (Request $request) {
+    return $request->user();
+});
\ No newline at end of file
diff --git a/Routes/web.php b/Routes/web.php
new file mode 100644
index 0000000..61ccd9f
--- /dev/null
+++ b/Routes/web.php
@@ -0,0 +1,27 @@
+<?php
+
+    /*
+    |--------------------------------------------------------------------------
+    | Web Routes
+    |--------------------------------------------------------------------------
+    |
+    | Here is where you can register web routes for your application. These
+    | routes are loaded by the RouteServiceProvider within a group which
+    | contains the "web" middleware group. Now create something great!
+    |
+    */
+
+    use Modules\Frontend\Http\Controllers\FrontendController;
+
+    Route::get('/', 'FrontendController@index');
+    Route::get('form-hibah', [FrontendController::class, 'hibah']);
+    Route::get('domain', [FrontendController::class, 'domain']);
+    Route::get('peneliti', [FrontendController::class, 'peneliti']);
+    Route::get('facility', [FrontendController::class, 'facility']);
+    Route::get('gapanalysis', [FrontendController::class, 'kuisioner']);
+    Route::get('consentform', [FrontendController::class, 'consent']);
+    Route::get('silx/ci', [FrontendController::class, 'silx_ci']);
+    Route::get('silx/ic', [FrontendController::class, 'silx_ic']);
+    Route::get('SILX/ci', [FrontendController::class, 'silx_ci']);
+    Route::get('SILX/ic', [FrontendController::class, 'silx_ic']);
+    Route::get('cakupan', [FrontendController::class, 'cakupan']);
diff --git a/Tests/Feature/.gitkeep b/Tests/Feature/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/Tests/Unit/.gitkeep b/Tests/Unit/.gitkeep
new file mode 100644
index 0000000..e69de29
diff --git a/composer.json b/composer.json
new file mode 100644
index 0000000..fd4a283
--- /dev/null
+++ b/composer.json
@@ -0,0 +1,24 @@
+{
+    "name": "putrakuningan/frontend-module",
+    "type": "laravel-module",
+    "description": "",
+    "authors": [
+        {
+            "name": "Daeng Deni Mardaeni",
+            "email": "ddeni05@gmail.com"
+        }
+    ],
+    "extra": {
+        "laravel": {
+            "providers": [],
+            "aliases": {
+
+            }
+        }
+    },
+    "autoload": {
+        "psr-4": {
+            "Modules\\Frontend\\": ""
+        }
+    }
+}
diff --git a/module.json b/module.json
new file mode 100644
index 0000000..d35d624
--- /dev/null
+++ b/module.json
@@ -0,0 +1,11 @@
+{
+    "name": "Frontend",
+    "alias": "frontend",
+    "description": "",
+    "keywords": [],
+    "priority": 0,
+    "providers": [
+        "Modules\\Frontend\\Providers\\FrontendServiceProvider"
+    ],
+    "files": []
+}