From: Louis Jeckel <louis.jeckel@outlook.cm>
Date: Wed, 5 Aug 2020 23:35:27 +0000 (+0200)
Subject: remove old home blocks, create podcasts mockup + admin page, design com page
X-Git-Url: http://git.cubedesigners.com/?a=commitdiff_plain;h=c2aa8750432302a2edc2f79860ce246da2d1911c;p=psq.git

remove old home blocks, create podcasts mockup + admin page, design com page
---

diff --git a/app/Http/Controllers/AdCampaignController.php b/app/Http/Controllers/AdCampaignController.php
index e591cac..563a12a 100644
--- a/app/Http/Controllers/AdCampaignController.php
+++ b/app/Http/Controllers/AdCampaignController.php
@@ -13,9 +13,19 @@ class AdCampaignController extends Controller
         return view('adCampaigns.search');
     }
 
+    /**
+     * @return \Illuminate\View\View
+     * @todo : Always last 3 ?
+     *
+     */
     public function index()
     {
-        \View::share('campaigns', AdCampaign::query()->orderByDesc('id')->take(3)->get());
+        $campaigns = AdCampaign::query()
+            ->orderByDesc('id')
+            ->take(3)
+            ->published()
+            ->get();
+        \View::share('campaigns', $campaigns);
         return view('adCampaigns.index');
     }
 
diff --git a/app/Http/Controllers/Admin/GuestController.php b/app/Http/Controllers/Admin/GuestController.php
new file mode 100644
index 0000000..2a0da63
--- /dev/null
+++ b/app/Http/Controllers/Admin/GuestController.php
@@ -0,0 +1,10 @@
+<?php
+
+namespace App\Http\Controllers\Admin;
+
+use A17\Twill\Http\Controllers\Admin\ModuleController;
+
+class GuestController extends ModuleController
+{
+    protected $moduleName = 'guests';
+}
diff --git a/app/Http/Controllers/PodcastController.php b/app/Http/Controllers/PodcastController.php
new file mode 100644
index 0000000..eb20ad5
--- /dev/null
+++ b/app/Http/Controllers/PodcastController.php
@@ -0,0 +1,17 @@
+<?php
+
+namespace App\Http\Controllers;
+
+use App\Models\Podcast;
+use Illuminate\Http\Request;
+
+class PodcastController extends Controller
+{
+    //
+
+    public function index()
+    {
+        \View::share('podcast', Podcast::published()->orderByDesc('id')->first());
+        return view('podcasts.index');
+    }
+}
diff --git a/app/Http/Requests/Admin/GuestRequest.php b/app/Http/Requests/Admin/GuestRequest.php
new file mode 100644
index 0000000..45b6bf4
--- /dev/null
+++ b/app/Http/Requests/Admin/GuestRequest.php
@@ -0,0 +1,18 @@
+<?php
+
+namespace App\Http\Requests\Admin;
+
+use A17\Twill\Http\Requests\Admin\Request;
+
+class GuestRequest extends Request
+{
+    public function rulesForCreate()
+    {
+        return [];
+    }
+
+    public function rulesForUpdate()
+    {
+        return [];
+    }
+}
diff --git a/app/Models/AdCampaign.php b/app/Models/AdCampaign.php
index eafe3e6..f357f5a 100644
--- a/app/Models/AdCampaign.php
+++ b/app/Models/AdCampaign.php
@@ -38,7 +38,7 @@ class AdCampaign extends Model implements Sortable
             'preview' => [
                 [
                     'name' => 'Miniature',
-                    'ratio' => 16 / 9,
+                    'ratio' => 0,
                 ],
             ],
 
diff --git a/app/Models/Guest.php b/app/Models/Guest.php
new file mode 100644
index 0000000..c918d97
--- /dev/null
+++ b/app/Models/Guest.php
@@ -0,0 +1,47 @@
+<?php
+
+namespace App\Models;
+
+use A17\Twill\Models\Behaviors\HasBlocks;
+use A17\Twill\Models\Behaviors\HasTranslation;
+use A17\Twill\Models\Behaviors\HasSlug;
+use A17\Twill\Models\Behaviors\HasMedias;
+use A17\Twill\Models\Behaviors\HasFiles;
+use A17\Twill\Models\Behaviors\HasRevisions;
+use A17\Twill\Models\Behaviors\HasPosition;
+use A17\Twill\Models\Behaviors\Sortable;
+use A17\Twill\Models\Model;
+
+class Guest extends Model
+{
+    use HasMedias;
+
+    protected $fillable = [
+        'name',
+        'job',
+        'podcast_id'
+    ];
+
+
+    public $mediasParams = [
+        'image' => [
+            'default' => [
+                [
+                    'name' => 'default',
+                    'ratio' => 1,
+                ],
+            ],
+
+        ],
+    ];
+
+
+    /**
+     * @return \Illuminate\Database\Eloquent\Relations\BelongsTo
+     */
+    public function podcast()
+    {
+        return $this->belongsTo(Podcast::class);
+    }
+
+}
diff --git a/app/Models/Podcast.php b/app/Models/Podcast.php
index 2cfc0a6..4d52972 100644
--- a/app/Models/Podcast.php
+++ b/app/Models/Podcast.php
@@ -7,6 +7,8 @@ use A17\Twill\Models\Behaviors\HasSlug;
 use A17\Twill\Models\Behaviors\HasMedias;
 use A17\Twill\Models\Behaviors\HasFiles;
 use A17\Twill\Models\Model;
+use FileService;
+use Illuminate\Support\Facades\Storage;
 
 class Podcast extends Model
 {
@@ -18,13 +20,9 @@ class Podcast extends Model
         'description',
         'sponsor',
         'sponsor_url',
-        'publish_start_date',
-        'guests'
+        'publish_start_date'
     ];
 
-    protected $casts = [
-        'guests' => 'array'
-    ];
 
     public $slugAttributes = [
         'title',
@@ -40,4 +38,19 @@ class Podcast extends Model
             ],
         ],
     ];
+
+    public $fileParams = [
+        'audio'
+    ];
+
+
+    /**
+     * @return \Illuminate\Database\Eloquent\Relations\HasMany
+     */
+    public function guests()
+    {
+        return $this->hasMany(Guest::class);
+    }
+
+
 }
diff --git a/app/Models/Revisions/GuestRevision.php b/app/Models/Revisions/GuestRevision.php
new file mode 100644
index 0000000..2323f1b
--- /dev/null
+++ b/app/Models/Revisions/GuestRevision.php
@@ -0,0 +1,10 @@
+<?php
+
+namespace App\Models\Revisions;
+
+use A17\Twill\Models\Revision;
+
+class GuestRevision extends Revision
+{
+    protected $table = "guest_revisions";
+}
diff --git a/app/Models/Slugs/GuestSlug.php b/app/Models/Slugs/GuestSlug.php
new file mode 100644
index 0000000..4d2191c
--- /dev/null
+++ b/app/Models/Slugs/GuestSlug.php
@@ -0,0 +1,10 @@
+<?php
+
+namespace App\Models\Slugs;
+
+use A17\Twill\Models\Model;
+
+class GuestSlug extends Model
+{
+    protected $table = "guest_slugs";
+}
diff --git a/app/Models/Translations/GuestTranslation.php b/app/Models/Translations/GuestTranslation.php
new file mode 100644
index 0000000..d74eae6
--- /dev/null
+++ b/app/Models/Translations/GuestTranslation.php
@@ -0,0 +1,11 @@
+<?php
+
+namespace App\Models\Translations;
+
+use A17\Twill\Models\Model;
+use App\Models\Guest;
+
+class GuestTranslation extends Model
+{
+    protected $baseModuleModel = Guest::class;
+}
diff --git a/app/Repositories/GuestRepository.php b/app/Repositories/GuestRepository.php
new file mode 100644
index 0000000..b5dba5e
--- /dev/null
+++ b/app/Repositories/GuestRepository.php
@@ -0,0 +1,22 @@
+<?php
+
+namespace App\Repositories;
+
+use A17\Twill\Repositories\Behaviors\HandleBlocks;
+use A17\Twill\Repositories\Behaviors\HandleTranslations;
+use A17\Twill\Repositories\Behaviors\HandleSlugs;
+use A17\Twill\Repositories\Behaviors\HandleMedias;
+use A17\Twill\Repositories\Behaviors\HandleFiles;
+use A17\Twill\Repositories\Behaviors\HandleRevisions;
+use A17\Twill\Repositories\ModuleRepository;
+use App\Models\Guest;
+
+class GuestRepository extends ModuleRepository
+{
+    use HandleMedias;
+
+    public function __construct(Guest $model)
+    {
+        $this->model = $model;
+    }
+}
diff --git a/app/Repositories/PodcastRepository.php b/app/Repositories/PodcastRepository.php
index 4574eff..ea97011 100644
--- a/app/Repositories/PodcastRepository.php
+++ b/app/Repositories/PodcastRepository.php
@@ -3,7 +3,7 @@
 namespace App\Repositories;
 
 use A17\Twill\Repositories\Behaviors\HandleBlocks;
-use A17\Twill\Repositories\Behaviors\HandleJsonRepeaters;
+use A17\Twill\Repositories\Behaviors\HandleRepeaters;
 use A17\Twill\Repositories\Behaviors\HandleSlugs;
 use A17\Twill\Repositories\Behaviors\HandleMedias;
 use A17\Twill\Repositories\Behaviors\HandleFiles;
@@ -12,12 +12,33 @@ use App\Models\Podcast;
 
 class PodcastRepository extends ModuleRepository
 {
-    use HandleSlugs, HandleMedias, HandleFiles, HandleBlocks, HandleJsonRepeaters;
+    use HandleSlugs, HandleMedias, HandleFiles, HandleBlocks, HandleRepeaters;
 
-    protected array $jsonRepeaters = ['guests'];
 
     public function __construct(Podcast $model)
     {
         $this->model = $model;
     }
+
+
+    /**
+     * @param \A17\Twill\Models\Model $object
+     * @param array $fields
+     */
+    public function afterSave($object, $fields)
+    {
+        $this->updateRepeater($object, $fields, 'guests', 'Guest', 'guests');
+        parent::afterSave($object, $fields);
+    }
+
+
+    /**
+     * @param \A17\Twill\Models\Model $object
+     * @return array
+     */
+    public function getFormFields($object)
+    {
+        $fields =  parent::getFormFields($object);
+        return $this->getFormFieldsForRepeater($object, $fields, 'guests', 'Guest', 'guests');
+    }
 }
diff --git a/app/Services/DiskPrivate.php b/app/Services/DiskPrivate.php
new file mode 100644
index 0000000..a340ec4
--- /dev/null
+++ b/app/Services/DiskPrivate.php
@@ -0,0 +1,41 @@
+<?php
+
+namespace A17\Twill\Services\FileLibrary;
+
+use Illuminate\Config\Repository as Config;
+use Illuminate\Contracts\Filesystem\Factory as FilesystemManager;
+use Illuminate\Support\Facades\Storage;
+
+class DiskPrivate implements FileServiceInterface
+{
+    /**
+     * @var FilesystemManager
+     */
+    protected $filesystemManager;
+
+    /**
+     * @var Config
+     */
+    protected $config;
+
+    /**
+     * @param FilesystemManager $filesystemManager
+     * @param Config $config
+     */
+    public function __construct(FilesystemManager $filesystemManager, Config $config)
+    {
+        $this->filesystemManager = $filesystemManager;
+        $this->config = $config;
+    }
+
+    /**
+     * @param mixed $id
+     * @return mixed
+     */
+    public function getUrl($id)
+    {
+        return $this->filesystemManager
+            ->disk($this->config->get('twill.file_library.disk'))
+            ->temporaryUrl($id, now()->addHour());
+    }
+}
diff --git a/app/View/Components/PillBox.php b/app/View/Components/PillBox.php
index b8a35d1..8324190 100644
--- a/app/View/Components/PillBox.php
+++ b/app/View/Components/PillBox.php
@@ -8,7 +8,7 @@ class PillBox extends Component
 {
     public string $title;
     public string $link;
-    public string $color;
+    public string $class;
 
     /**
      * Create a new component instance.
@@ -21,7 +21,7 @@ class PillBox extends Component
     {
         $this->title = $title;
         $this->link = $link;
-        $this->color = $color;
+        $this->class = "border-$color";
     }
 
     /**
diff --git a/config/twill.php b/config/twill.php
index 7f2de7b..dccbd52 100644
--- a/config/twill.php
+++ b/config/twill.php
@@ -259,11 +259,14 @@ return [
         ],
         'crops' => [
             'profile' => [
-                'profile' => [
-                    'name' => 'profile',
-                    'ratio' => 1
-                ]
+                'default' => [
+                    [
+                        'name' => 'default',
+                        'ratio' => 1
+                    ],
+                ],
             ],
+
             'image' => [
                 'desktop' => [
                     [
diff --git a/database/migrations/2020_08_04_180816_create_guests_tables.php b/database/migrations/2020_08_04_180816_create_guests_tables.php
new file mode 100644
index 0000000..3d385e5
--- /dev/null
+++ b/database/migrations/2020_08_04_180816_create_guests_tables.php
@@ -0,0 +1,33 @@
+<?php
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+
+class CreateGuestsTables extends Migration
+{
+    public function up()
+    {
+        Schema::create('guests', function (Blueprint $table) {
+            // this will create an id, a "published" column, and soft delete and timestamps columns
+            createDefaultTableFields($table);
+
+            $table->string('name');
+            $table->string('job');
+            $table->unsignedInteger('podcast_id');
+
+
+
+            // add those 2 columns to enable publication timeframe fields (you can use publish_start_date only if you don't need to provide the ability to specify an end date)
+            // $table->timestamp('publish_start_date')->nullable();
+            // $table->timestamp('publish_end_date')->nullable();
+        });
+
+
+
+    }
+
+    public function down()
+    {
+        Schema::dropIfExists('guests');
+    }
+}
diff --git a/public/admin/css/admin.css b/public/admin/css/admin.css
index 6dc3827..017009b 100644
--- a/public/admin/css/admin.css
+++ b/public/admin/css/admin.css
@@ -1,7 +1,4 @@
 @import url(https://fonts.googleapis.com/css?family=Nunito);@charset "UTF-8";
-/*
- Begin Custom
- */
 .bootstrap {
   /*!
    * Bootstrap v4.4.1 (https://getbootstrap.com/)
@@ -11,11 +8,11 @@
    */
 }
 .bootstrap :root {
-  --blue: #074e9c;
+  --blue: #3490dc;
   --indigo: #6574cd;
   --purple: #9561e2;
   --pink: #f66d9b;
-  --red: #d04d4a;
+  --red: #e3342f;
   --orange: #f6993f;
   --yellow: #ffed4a;
   --green: #38c172;
@@ -24,12 +21,12 @@
   --white: #fff;
   --gray: #6c757d;
   --gray-dark: #343a40;
-  --primary: #074e9c;
+  --primary: #3490dc;
   --secondary: #6c757d;
   --success: #38c172;
   --info: #6cb2eb;
   --warning: #ffed4a;
-  --danger: #d04d4a;
+  --danger: #e3342f;
   --light: #f8f9fa;
   --dark: #343a40;
   --breakpoint-xs: 0;
@@ -138,12 +135,12 @@
   top: -0.5em;
 }
 .bootstrap a {
-  color: #074e9c;
+  color: #3490dc;
   text-decoration: none;
   background-color: transparent;
 }
 .bootstrap a:hover {
-  color: #042953;
+  color: #1d68a7;
   text-decoration: underline;
 }
 .bootstrap a:not([href]) {
@@ -407,7 +404,6 @@
   background-color: #f8fafc;
   border: 1px solid #dee2e6;
   border-radius: 0.25rem;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
   max-width: 100%;
   height: auto;
 }
@@ -436,13 +432,11 @@ a > .bootstrap code {
   color: #fff;
   background-color: #212529;
   border-radius: 0.2rem;
-  box-shadow: inset 0 -0.1rem 0 rgba(0, 0, 0, 0.25);
 }
 .bootstrap kbd kbd {
   padding: 0;
   font-size: 100%;
   font-weight: 700;
-  box-shadow: none;
 }
 .bootstrap pre {
   display: block;
@@ -1407,20 +1401,20 @@ a > .bootstrap code {
 .bootstrap .table-primary,
 .bootstrap .table-primary > th,
 .bootstrap .table-primary > td {
-  background-color: #bacde3;
+  background-color: #c6e0f5;
 }
 .bootstrap .table-primary th,
 .bootstrap .table-primary td,
 .bootstrap .table-primary thead th,
 .bootstrap .table-primary tbody + tbody {
-  border-color: #7ea3cc;
+  border-color: #95c5ed;
 }
 .bootstrap .table-hover .table-primary:hover {
-  background-color: #a8c0dc;
+  background-color: #b0d4f1;
 }
 .bootstrap .table-hover .table-primary:hover > td,
 .bootstrap .table-hover .table-primary:hover > th {
-  background-color: #a8c0dc;
+  background-color: #b0d4f1;
 }
 .bootstrap .table-secondary,
 .bootstrap .table-secondary > th,
@@ -1497,20 +1491,20 @@ a > .bootstrap code {
 .bootstrap .table-danger,
 .bootstrap .table-danger > th,
 .bootstrap .table-danger > td {
-  background-color: #f2cdcc;
+  background-color: #f7c6c5;
 }
 .bootstrap .table-danger th,
 .bootstrap .table-danger td,
 .bootstrap .table-danger thead th,
 .bootstrap .table-danger tbody + tbody {
-  border-color: #e7a2a1;
+  border-color: #f09593;
 }
 .bootstrap .table-hover .table-danger:hover {
-  background-color: #edb9b8;
+  background-color: #f4b0af;
 }
 .bootstrap .table-hover .table-danger:hover > td,
 .bootstrap .table-hover .table-danger:hover > th {
-  background-color: #edb9b8;
+  background-color: #f4b0af;
 }
 .bootstrap .table-light,
 .bootstrap .table-light > th,
@@ -1655,7 +1649,6 @@ a > .bootstrap code {
   background-clip: padding-box;
   border: 1px solid #ced4da;
   border-radius: 0.25rem;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }
 @media (prefers-reduced-motion: reduce) {
@@ -1674,9 +1667,9 @@ a > .bootstrap code {
 .bootstrap .form-control:focus {
   color: #495057;
   background-color: #fff;
-  border-color: #2d8df6;
+  border-color: #a1cbef;
   outline: 0;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .form-control::-webkit-input-placeholder {
   color: #6c757d;
@@ -1899,7 +1892,7 @@ a > .bootstrap code {
   width: 100%;
   margin-top: 0.25rem;
   font-size: 80%;
-  color: #d04d4a;
+  color: #e3342f;
 }
 .bootstrap .invalid-tooltip {
   position: absolute;
@@ -1912,7 +1905,7 @@ a > .bootstrap code {
   font-size: 0.7875rem;
   line-height: 1.6;
   color: #fff;
-  background-color: rgba(208, 77, 74, 0.9);
+  background-color: rgba(227, 52, 47, 0.9);
   border-radius: 0.25rem;
 }
 .was-validated .bootstrap:invalid ~ .invalid-feedback,
@@ -1921,32 +1914,32 @@ a > .bootstrap code {
   display: block;
 }
 .was-validated .bootstrap .form-control:invalid, .bootstrap .form-control.is-invalid {
-  border-color: #d04d4a;
+  border-color: #e3342f;
   padding-right: calc(1.6em + 0.75rem);
-  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23d04d4a' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23d04d4a' stroke='none'/%3e%3c/svg%3e");
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e3342f' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e3342f' stroke='none'/%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right calc(0.4em + 0.1875rem) center;
   background-size: calc(0.8em + 0.375rem) calc(0.8em + 0.375rem);
 }
 .was-validated .bootstrap .form-control:invalid:focus, .bootstrap .form-control.is-invalid:focus {
-  border-color: #d04d4a;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  border-color: #e3342f;
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 .was-validated .bootstrap textarea.form-control:invalid, .bootstrap textarea.form-control.is-invalid {
   padding-right: calc(1.6em + 0.75rem);
   background-position: top calc(0.4em + 0.1875rem) right calc(0.4em + 0.1875rem);
 }
 .was-validated .bootstrap .custom-select:invalid, .bootstrap .custom-select.is-invalid {
-  border-color: #d04d4a;
+  border-color: #e3342f;
   padding-right: calc(0.75em + 2.3125rem);
-  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23d04d4a' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23d04d4a' stroke='none'/%3e%3c/svg%3e") #fff no-repeat center right 1.75rem/calc(0.8em + 0.375rem) calc(0.8em + 0.375rem);
+  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e3342f' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e3342f' stroke='none'/%3e%3c/svg%3e") #fff no-repeat center right 1.75rem/calc(0.8em + 0.375rem) calc(0.8em + 0.375rem);
 }
 .was-validated .bootstrap .custom-select:invalid:focus, .bootstrap .custom-select.is-invalid:focus {
-  border-color: #d04d4a;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  border-color: #e3342f;
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 .was-validated .bootstrap .form-check-input:invalid ~ .form-check-label, .bootstrap .form-check-input.is-invalid ~ .form-check-label {
-  color: #d04d4a;
+  color: #e3342f;
 }
 .was-validated .bootstrap .form-check-input:invalid ~ .invalid-feedback,
 .was-validated .bootstrap .form-check-input:invalid ~ .invalid-tooltip, .bootstrap .form-check-input.is-invalid ~ .invalid-feedback,
@@ -1954,27 +1947,27 @@ a > .bootstrap code {
   display: block;
 }
 .was-validated .bootstrap .custom-control-input:invalid ~ .custom-control-label, .bootstrap .custom-control-input.is-invalid ~ .custom-control-label {
-  color: #d04d4a;
+  color: #e3342f;
 }
 .was-validated .bootstrap .custom-control-input:invalid ~ .custom-control-label::before, .bootstrap .custom-control-input.is-invalid ~ .custom-control-label::before {
-  border-color: #d04d4a;
+  border-color: #e3342f;
 }
 .was-validated .bootstrap .custom-control-input:invalid:checked ~ .custom-control-label::before, .bootstrap .custom-control-input.is-invalid:checked ~ .custom-control-label::before {
-  border-color: #db7572;
-  background-color: #db7572;
+  border-color: #e9605c;
+  background-color: #e9605c;
 }
 .was-validated .bootstrap .custom-control-input:invalid:focus ~ .custom-control-label::before, .bootstrap .custom-control-input.is-invalid:focus ~ .custom-control-label::before {
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 .was-validated .bootstrap .custom-control-input:invalid:focus:not(:checked) ~ .custom-control-label::before, .bootstrap .custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before {
-  border-color: #d04d4a;
+  border-color: #e3342f;
 }
 .was-validated .bootstrap .custom-file-input:invalid ~ .custom-file-label, .bootstrap .custom-file-input.is-invalid ~ .custom-file-label {
-  border-color: #d04d4a;
+  border-color: #e3342f;
 }
 .was-validated .bootstrap .custom-file-input:invalid:focus ~ .custom-file-label, .bootstrap .custom-file-input.is-invalid:focus ~ .custom-file-label {
-  border-color: #d04d4a;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  border-color: #e3342f;
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 .bootstrap .form-inline {
   display: flex;
@@ -2062,17 +2055,10 @@ a > .bootstrap code {
 }
 .bootstrap .btn:focus, .bootstrap .btn.focus {
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .btn.disabled, .bootstrap .btn:disabled {
   opacity: 0.65;
-  box-shadow: none;
-}
-.bootstrap .btn:not(:disabled):not(.disabled):active, .bootstrap .btn:not(:disabled):not(.disabled).active {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
-}
-.bootstrap .btn:not(:disabled):not(.disabled):active:focus, .bootstrap .btn:not(:disabled):not(.disabled).active:focus {
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25), inset 0 3px 5px rgba(0, 0, 0, 0.125);
 }
 .bootstrap a.btn.disabled,
 .bootstrap fieldset:disabled a.btn {
@@ -2080,39 +2066,37 @@ a > .bootstrap code {
 }
 .bootstrap .btn-primary {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .btn-primary:hover {
   color: #fff;
-  background-color: #053c77;
-  border-color: #05366b;
+  background-color: #227dc7;
+  border-color: #2176bd;
 }
 .bootstrap .btn-primary:focus, .bootstrap .btn-primary.focus {
   color: #fff;
-  background-color: #053c77;
-  border-color: #05366b;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(44, 105, 171, 0.5);
+  background-color: #227dc7;
+  border-color: #2176bd;
+  box-shadow: 0 0 0 0.2rem rgba(82, 161, 225, 0.5);
 }
 .bootstrap .btn-primary.disabled, .bootstrap .btn-primary:disabled {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .btn-primary:not(:disabled):not(.disabled):active, .bootstrap .btn-primary:not(:disabled):not(.disabled).active, .show > .bootstrap .btn-primary.dropdown-toggle {
   color: #fff;
-  background-color: #05366b;
-  border-color: #042f5f;
+  background-color: #2176bd;
+  border-color: #1f6fb2;
 }
 .bootstrap .btn-primary:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-primary:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-primary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(44, 105, 171, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(82, 161, 225, 0.5);
 }
 .bootstrap .btn-secondary {
   color: #fff;
   background-color: #6c757d;
   border-color: #6c757d;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .btn-secondary:hover {
   color: #fff;
@@ -2123,7 +2107,7 @@ a > .bootstrap code {
   color: #fff;
   background-color: #5a6268;
   border-color: #545b62;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
 }
 .bootstrap .btn-secondary.disabled, .bootstrap .btn-secondary:disabled {
   color: #fff;
@@ -2136,13 +2120,12 @@ a > .bootstrap code {
   border-color: #4e555b;
 }
 .bootstrap .btn-secondary:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-secondary:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-secondary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
 }
 .bootstrap .btn-success {
   color: #fff;
   background-color: #38c172;
   border-color: #38c172;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .btn-success:hover {
   color: #fff;
@@ -2153,7 +2136,7 @@ a > .bootstrap code {
   color: #fff;
   background-color: #2fa360;
   border-color: #2d995b;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
 }
 .bootstrap .btn-success.disabled, .bootstrap .btn-success:disabled {
   color: #fff;
@@ -2166,13 +2149,12 @@ a > .bootstrap code {
   border-color: #2a9055;
 }
 .bootstrap .btn-success:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-success:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-success.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
 }
 .bootstrap .btn-info {
   color: #212529;
   background-color: #6cb2eb;
   border-color: #6cb2eb;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .btn-info:hover {
   color: #fff;
@@ -2183,7 +2165,7 @@ a > .bootstrap code {
   color: #fff;
   background-color: #4aa0e6;
   border-color: #3f9ae5;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
 }
 .bootstrap .btn-info.disabled, .bootstrap .btn-info:disabled {
   color: #212529;
@@ -2196,13 +2178,12 @@ a > .bootstrap code {
   border-color: #3495e3;
 }
 .bootstrap .btn-info:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-info:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-info.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
 }
 .bootstrap .btn-warning {
   color: #212529;
   background-color: #ffed4a;
   border-color: #ffed4a;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .btn-warning:hover {
   color: #212529;
@@ -2213,7 +2194,7 @@ a > .bootstrap code {
   color: #212529;
   background-color: #ffe924;
   border-color: #ffe817;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
 }
 .bootstrap .btn-warning.disabled, .bootstrap .btn-warning:disabled {
   color: #212529;
@@ -2226,43 +2207,41 @@ a > .bootstrap code {
   border-color: #ffe70a;
 }
 .bootstrap .btn-warning:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-warning:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-warning.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
 }
 .bootstrap .btn-danger {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 .bootstrap .btn-danger:hover {
   color: #fff;
-  background-color: #c23532;
-  border-color: #b73330;
+  background-color: #d0211c;
+  border-color: #c51f1a;
 }
 .bootstrap .btn-danger:focus, .bootstrap .btn-danger.focus {
   color: #fff;
-  background-color: #c23532;
-  border-color: #b73330;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(215, 104, 101, 0.5);
+  background-color: #d0211c;
+  border-color: #c51f1a;
+  box-shadow: 0 0 0 0.2rem rgba(231, 82, 78, 0.5);
 }
 .bootstrap .btn-danger.disabled, .bootstrap .btn-danger:disabled {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 .bootstrap .btn-danger:not(:disabled):not(.disabled):active, .bootstrap .btn-danger:not(:disabled):not(.disabled).active, .show > .bootstrap .btn-danger.dropdown-toggle {
   color: #fff;
-  background-color: #b73330;
-  border-color: #ad302d;
+  background-color: #c51f1a;
+  border-color: #b91d19;
 }
 .bootstrap .btn-danger:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-danger:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-danger.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(215, 104, 101, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(231, 82, 78, 0.5);
 }
 .bootstrap .btn-light {
   color: #212529;
   background-color: #f8f9fa;
   border-color: #f8f9fa;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .btn-light:hover {
   color: #212529;
@@ -2273,7 +2252,7 @@ a > .bootstrap code {
   color: #212529;
   background-color: #e2e6ea;
   border-color: #dae0e5;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
 }
 .bootstrap .btn-light.disabled, .bootstrap .btn-light:disabled {
   color: #212529;
@@ -2286,13 +2265,12 @@ a > .bootstrap code {
   border-color: #d3d9df;
 }
 .bootstrap .btn-light:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-light:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-light.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
 }
 .bootstrap .btn-dark {
   color: #fff;
   background-color: #343a40;
   border-color: #343a40;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .btn-dark:hover {
   color: #fff;
@@ -2303,7 +2281,7 @@ a > .bootstrap code {
   color: #fff;
   background-color: #23272b;
   border-color: #1d2124;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
 }
 .bootstrap .btn-dark.disabled, .bootstrap .btn-dark:disabled {
   color: #fff;
@@ -2316,31 +2294,31 @@ a > .bootstrap code {
   border-color: #171a1d;
 }
 .bootstrap .btn-dark:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-dark:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-dark.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
 }
 .bootstrap .btn-outline-primary {
-  color: #074e9c;
-  border-color: #074e9c;
+  color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .btn-outline-primary:hover {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .btn-outline-primary:focus, .bootstrap .btn-outline-primary.focus {
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.5);
 }
 .bootstrap .btn-outline-primary.disabled, .bootstrap .btn-outline-primary:disabled {
-  color: #074e9c;
+  color: #3490dc;
   background-color: transparent;
 }
 .bootstrap .btn-outline-primary:not(:disabled):not(.disabled):active, .bootstrap .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .bootstrap .btn-outline-primary.dropdown-toggle {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .btn-outline-primary:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-primary:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-primary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(7, 78, 156, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.5);
 }
 .bootstrap .btn-outline-secondary {
   color: #6c757d;
@@ -2364,7 +2342,7 @@ a > .bootstrap code {
   border-color: #6c757d;
 }
 .bootstrap .btn-outline-secondary:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-secondary:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-secondary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
 }
 .bootstrap .btn-outline-success {
   color: #38c172;
@@ -2388,7 +2366,7 @@ a > .bootstrap code {
   border-color: #38c172;
 }
 .bootstrap .btn-outline-success:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-success:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-success.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(56, 193, 114, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(56, 193, 114, 0.5);
 }
 .bootstrap .btn-outline-info {
   color: #6cb2eb;
@@ -2412,7 +2390,7 @@ a > .bootstrap code {
   border-color: #6cb2eb;
 }
 .bootstrap .btn-outline-info:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-info:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-info.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(108, 178, 235, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(108, 178, 235, 0.5);
 }
 .bootstrap .btn-outline-warning {
   color: #ffed4a;
@@ -2436,31 +2414,31 @@ a > .bootstrap code {
   border-color: #ffed4a;
 }
 .bootstrap .btn-outline-warning:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-warning:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-warning.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(255, 237, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(255, 237, 74, 0.5);
 }
 .bootstrap .btn-outline-danger {
-  color: #d04d4a;
-  border-color: #d04d4a;
+  color: #e3342f;
+  border-color: #e3342f;
 }
 .bootstrap .btn-outline-danger:hover {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 .bootstrap .btn-outline-danger:focus, .bootstrap .btn-outline-danger.focus {
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.5);
 }
 .bootstrap .btn-outline-danger.disabled, .bootstrap .btn-outline-danger:disabled {
-  color: #d04d4a;
+  color: #e3342f;
   background-color: transparent;
 }
 .bootstrap .btn-outline-danger:not(:disabled):not(.disabled):active, .bootstrap .btn-outline-danger:not(:disabled):not(.disabled).active, .show > .bootstrap .btn-outline-danger.dropdown-toggle {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 .bootstrap .btn-outline-danger:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-danger:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-danger.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(208, 77, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.5);
 }
 .bootstrap .btn-outline-light {
   color: #f8f9fa;
@@ -2484,7 +2462,7 @@ a > .bootstrap code {
   border-color: #f8f9fa;
 }
 .bootstrap .btn-outline-light:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-light:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-light.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
 }
 .bootstrap .btn-outline-dark {
   color: #343a40;
@@ -2508,15 +2486,15 @@ a > .bootstrap code {
   border-color: #343a40;
 }
 .bootstrap .btn-outline-dark:not(:disabled):not(.disabled):active:focus, .bootstrap .btn-outline-dark:not(:disabled):not(.disabled).active:focus, .show > .bootstrap .btn-outline-dark.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
 }
 .bootstrap .btn-link {
   font-weight: 400;
-  color: #074e9c;
+  color: #3490dc;
   text-decoration: none;
 }
 .bootstrap .btn-link:hover {
-  color: #042953;
+  color: #1d68a7;
   text-decoration: underline;
 }
 .bootstrap .btn-link:focus, .bootstrap .btn-link.focus {
@@ -2616,7 +2594,6 @@ a > .bootstrap code {
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 0.25rem;
-  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
 }
 .bootstrap .dropdown-menu-left {
   right: auto;
@@ -2769,7 +2746,7 @@ a > .bootstrap code {
 .bootstrap .dropdown-item.active, .bootstrap .dropdown-item:active {
   color: #fff;
   text-decoration: none;
-  background-color: #074e9c;
+  background-color: #3490dc;
 }
 .bootstrap .dropdown-item.disabled, .bootstrap .dropdown-item:disabled {
   color: #6c757d;
@@ -2853,12 +2830,6 @@ a > .bootstrap code {
   padding-right: 0.75rem;
   padding-left: 0.75rem;
 }
-.bootstrap .btn-group.show .dropdown-toggle {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
-}
-.bootstrap .btn-group.show .dropdown-toggle.btn-link {
-  box-shadow: none;
-}
 .bootstrap .btn-group-vertical {
   flex-direction: column;
   align-items: flex-start;
@@ -3074,21 +3045,19 @@ a > .bootstrap code {
 }
 .bootstrap .custom-control-input:checked ~ .custom-control-label::before {
   color: #fff;
-  border-color: #074e9c;
-  background-color: #074e9c;
-  box-shadow: none;
+  border-color: #3490dc;
+  background-color: #3490dc;
 }
 .bootstrap .custom-control-input:focus ~ .custom-control-label::before {
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
-  border-color: #2d8df6;
+  border-color: #a1cbef;
 }
 .bootstrap .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
   color: #fff;
-  background-color: #5ea7f8;
-  border-color: #5ea7f8;
-  box-shadow: none;
+  background-color: #cce3f6;
+  border-color: #cce3f6;
 }
 .bootstrap .custom-control-input[disabled] ~ .custom-control-label, .bootstrap .custom-control-input:disabled ~ .custom-control-label {
   color: #6c757d;
@@ -3112,7 +3081,6 @@ a > .bootstrap code {
   content: "";
   background-color: #fff;
   border: #adb5bd solid 1px;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .custom-control-label::after {
   position: absolute;
@@ -3131,18 +3099,17 @@ a > .bootstrap code {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='8' height='8' viewBox='0 0 8 8'%3e%3cpath fill='%23fff' d='M6.564.75l-3.59 3.612-1.538-1.55L0 4.26l2.974 2.99L8 2.193z'/%3e%3c/svg%3e");
 }
 .bootstrap .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
-  border-color: #074e9c;
-  background-color: #074e9c;
-  box-shadow: none;
+  border-color: #3490dc;
+  background-color: #3490dc;
 }
 .bootstrap .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3e%3cpath stroke='%23fff' d='M0 2h4'/%3e%3c/svg%3e");
 }
 .bootstrap .custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 .bootstrap .custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 .bootstrap .custom-radio .custom-control-label::before {
   border-radius: 50%;
@@ -3151,7 +3118,7 @@ a > .bootstrap code {
   background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
 }
 .bootstrap .custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 .bootstrap .custom-switch {
   padding-left: 2.25rem;
@@ -3181,7 +3148,7 @@ a > .bootstrap code {
   transform: translateX(0.75rem);
 }
 .bootstrap .custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 .bootstrap .custom-select {
   display: inline-block;
@@ -3196,15 +3163,14 @@ a > .bootstrap code {
   background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;
   border: 1px solid #ced4da;
   border-radius: 0.25rem;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
 }
 .bootstrap .custom-select:focus {
-  border-color: #2d8df6;
+  border-color: #a1cbef;
   outline: 0;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .custom-select:focus::-ms-value {
   color: #495057;
@@ -3256,8 +3222,8 @@ a > .bootstrap code {
   opacity: 0;
 }
 .bootstrap .custom-file-input:focus ~ .custom-file-label {
-  border-color: #2d8df6;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  border-color: #a1cbef;
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .custom-file-input[disabled] ~ .custom-file-label, .bootstrap .custom-file-input:disabled ~ .custom-file-label {
   background-color: #e9ecef;
@@ -3282,7 +3248,6 @@ a > .bootstrap code {
   background-color: #fff;
   border: 1px solid #ced4da;
   border-radius: 0.25rem;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 .bootstrap .custom-file-label::after {
   position: absolute;
@@ -3313,13 +3278,13 @@ a > .bootstrap code {
   outline: none;
 }
 .bootstrap .custom-range:focus::-webkit-slider-thumb {
-  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .custom-range:focus::-moz-range-thumb {
-  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .custom-range:focus::-ms-thumb {
-  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .custom-range::-moz-focus-outer {
   border: 0;
@@ -3328,10 +3293,9 @@ a > .bootstrap code {
   width: 1rem;
   height: 1rem;
   margin-top: -0.25rem;
-  background-color: #074e9c;
+  background-color: #3490dc;
   border: 0;
   border-radius: 1rem;
-  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
   -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   -webkit-appearance: none;
@@ -3344,7 +3308,7 @@ a > .bootstrap code {
   }
 }
 .bootstrap .custom-range::-webkit-slider-thumb:active {
-  background-color: #5ea7f8;
+  background-color: #cce3f6;
 }
 .bootstrap .custom-range::-webkit-slider-runnable-track {
   width: 100%;
@@ -3354,15 +3318,13 @@ a > .bootstrap code {
   background-color: #dee2e6;
   border-color: transparent;
   border-radius: 1rem;
-  box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1);
 }
 .bootstrap .custom-range::-moz-range-thumb {
   width: 1rem;
   height: 1rem;
-  background-color: #074e9c;
+  background-color: #3490dc;
   border: 0;
   border-radius: 1rem;
-  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
   -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   -moz-appearance: none;
@@ -3375,7 +3337,7 @@ a > .bootstrap code {
   }
 }
 .bootstrap .custom-range::-moz-range-thumb:active {
-  background-color: #5ea7f8;
+  background-color: #cce3f6;
 }
 .bootstrap .custom-range::-moz-range-track {
   width: 100%;
@@ -3385,7 +3347,6 @@ a > .bootstrap code {
   background-color: #dee2e6;
   border-color: transparent;
   border-radius: 1rem;
-  box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1);
 }
 .bootstrap .custom-range::-ms-thumb {
   width: 1rem;
@@ -3393,10 +3354,9 @@ a > .bootstrap code {
   margin-top: 0;
   margin-right: 0.2rem;
   margin-left: 0.2rem;
-  background-color: #074e9c;
+  background-color: #3490dc;
   border: 0;
   border-radius: 1rem;
-  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
   -ms-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   appearance: none;
@@ -3408,7 +3368,7 @@ a > .bootstrap code {
   }
 }
 .bootstrap .custom-range::-ms-thumb:active {
-  background-color: #5ea7f8;
+  background-color: #cce3f6;
 }
 .bootstrap .custom-range::-ms-track {
   width: 100%;
@@ -3418,7 +3378,6 @@ a > .bootstrap code {
   background-color: transparent;
   border-color: transparent;
   border-width: 0.5rem;
-  box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1);
 }
 .bootstrap .custom-range::-ms-fill-lower {
   background-color: #dee2e6;
@@ -3511,7 +3470,7 @@ a > .bootstrap code {
 .bootstrap .nav-pills .nav-link.active,
 .bootstrap .nav-pills .show > .nav-link {
   color: #fff;
-  background-color: #074e9c;
+  background-color: #3490dc;
 }
 .bootstrap .nav-fill .nav-item {
   flex: 1 1 auto;
@@ -4112,13 +4071,13 @@ a > .bootstrap code {
   padding: 0.5rem 0.75rem;
   margin-left: -1px;
   line-height: 1.25;
-  color: #074e9c;
+  color: #3490dc;
   background-color: #fff;
   border: 1px solid #dee2e6;
 }
 .bootstrap .page-link:hover {
   z-index: 2;
-  color: #042953;
+  color: #1d68a7;
   text-decoration: none;
   background-color: #e9ecef;
   border-color: #dee2e6;
@@ -4126,7 +4085,7 @@ a > .bootstrap code {
 .bootstrap .page-link:focus {
   z-index: 3;
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 .bootstrap .page-item:first-child .page-link {
   margin-left: 0;
@@ -4140,8 +4099,8 @@ a > .bootstrap code {
 .bootstrap .page-item.active .page-link {
   z-index: 3;
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .page-item.disabled .page-link {
   color: #6c757d;
@@ -4211,15 +4170,15 @@ a.bootstrap .badge:hover, a.bootstrap .badge:focus {
 }
 .bootstrap .badge-primary {
   color: #fff;
-  background-color: #074e9c;
+  background-color: #3490dc;
 }
 a.bootstrap .badge-primary:hover, a.bootstrap .badge-primary:focus {
   color: #fff;
-  background-color: #05366b;
+  background-color: #2176bd;
 }
 a.bootstrap .badge-primary:focus, a.bootstrap .badge-primary.focus {
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.5);
 }
 
 .bootstrap .badge-secondary {
@@ -4276,15 +4235,15 @@ a.bootstrap .badge-warning:focus, a.bootstrap .badge-warning.focus {
 
 .bootstrap .badge-danger {
   color: #fff;
-  background-color: #d04d4a;
+  background-color: #e3342f;
 }
 a.bootstrap .badge-danger:hover, a.bootstrap .badge-danger:focus {
   color: #fff;
-  background-color: #b73330;
+  background-color: #c51f1a;
 }
 a.bootstrap .badge-danger:focus, a.bootstrap .badge-danger.focus {
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.5);
 }
 
 .bootstrap .badge-light {
@@ -4353,15 +4312,15 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   color: inherit;
 }
 .bootstrap .alert-primary {
-  color: #042951;
-  background-color: #cddceb;
-  border-color: #bacde3;
+  color: #1b4b72;
+  background-color: #d6e9f8;
+  border-color: #c6e0f5;
 }
 .bootstrap .alert-primary hr {
-  border-top-color: #a8c0dc;
+  border-top-color: #b0d4f1;
 }
 .bootstrap .alert-primary .alert-link {
-  color: #021020;
+  color: #113049;
 }
 .bootstrap .alert-secondary {
   color: #383d41;
@@ -4408,15 +4367,15 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   color: #5d561b;
 }
 .bootstrap .alert-danger {
-  color: #6c2826;
-  background-color: #f6dbdb;
-  border-color: #f2cdcc;
+  color: #761b18;
+  background-color: #f9d6d5;
+  border-color: #f7c6c5;
 }
 .bootstrap .alert-danger hr {
-  border-top-color: #edb9b8;
+  border-top-color: #f4b0af;
 }
 .bootstrap .alert-danger .alert-link {
-  color: #461a19;
+  color: #4c110f;
 }
 .bootstrap .alert-light {
   color: #818182;
@@ -4463,7 +4422,6 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   font-size: 0.675rem;
   background-color: #e9ecef;
   border-radius: 0.25rem;
-  box-shadow: inset 0 0.1rem 0.1rem rgba(0, 0, 0, 0.1);
 }
 .bootstrap .progress-bar {
   display: flex;
@@ -4473,7 +4431,7 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   color: #fff;
   text-align: center;
   white-space: nowrap;
-  background-color: #074e9c;
+  background-color: #3490dc;
   transition: width 0.6s ease;
 }
 @media (prefers-reduced-motion: reduce) {
@@ -4546,8 +4504,8 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
 .bootstrap .list-group-item.active {
   z-index: 2;
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 .bootstrap .list-group-item + .bootstrap .list-group-item {
   border-top-width: 0;
@@ -4686,17 +4644,17 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   border-bottom-width: 0;
 }
 .bootstrap .list-group-item-primary {
-  color: #042951;
-  background-color: #bacde3;
+  color: #1b4b72;
+  background-color: #c6e0f5;
 }
 .bootstrap .list-group-item-primary.list-group-item-action:hover, .bootstrap .list-group-item-primary.list-group-item-action:focus {
-  color: #042951;
-  background-color: #a8c0dc;
+  color: #1b4b72;
+  background-color: #b0d4f1;
 }
 .bootstrap .list-group-item-primary.list-group-item-action.active {
   color: #fff;
-  background-color: #042951;
-  border-color: #042951;
+  background-color: #1b4b72;
+  border-color: #1b4b72;
 }
 .bootstrap .list-group-item-secondary {
   color: #383d41;
@@ -4751,17 +4709,17 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   border-color: #857b26;
 }
 .bootstrap .list-group-item-danger {
-  color: #6c2826;
-  background-color: #f2cdcc;
+  color: #761b18;
+  background-color: #f7c6c5;
 }
 .bootstrap .list-group-item-danger.list-group-item-action:hover, .bootstrap .list-group-item-danger.list-group-item-action:focus {
-  color: #6c2826;
-  background-color: #edb9b8;
+  color: #761b18;
+  background-color: #f4b0af;
 }
 .bootstrap .list-group-item-danger.list-group-item-action.active {
   color: #fff;
-  background-color: #6c2826;
-  border-color: #6c2826;
+  background-color: #761b18;
+  border-color: #761b18;
 }
 .bootstrap .list-group-item-light {
   color: #818182;
@@ -4939,7 +4897,6 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.2);
   border-radius: 0.3rem;
-  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.5);
   outline: 0;
 }
 .bootstrap .modal-backdrop {
@@ -5016,9 +4973,6 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   .bootstrap .modal-dialog-centered::before {
     height: calc(100vh - 3.5rem);
   }
-  .bootstrap .modal-content {
-    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
-  }
   .bootstrap .modal-sm {
     max-width: 300px;
   }
@@ -5155,7 +5109,6 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.2);
   border-radius: 0.3rem;
-  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
 }
 .bootstrap .popover .arrow {
   position: absolute;
@@ -5506,12 +5459,12 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   vertical-align: text-top !important;
 }
 .bootstrap .bg-primary {
-  background-color: #074e9c !important;
+  background-color: #3490dc !important;
 }
 .bootstrap a.bg-primary:hover, .bootstrap a.bg-primary:focus,
 .bootstrap button.bg-primary:hover,
 .bootstrap button.bg-primary:focus {
-  background-color: #05366b !important;
+  background-color: #2176bd !important;
 }
 .bootstrap .bg-secondary {
   background-color: #6c757d !important;
@@ -5546,12 +5499,12 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   background-color: #ffe817 !important;
 }
 .bootstrap .bg-danger {
-  background-color: #d04d4a !important;
+  background-color: #e3342f !important;
 }
 .bootstrap a.bg-danger:hover, .bootstrap a.bg-danger:focus,
 .bootstrap button.bg-danger:hover,
 .bootstrap button.bg-danger:focus {
-  background-color: #b73330 !important;
+  background-color: #c51f1a !important;
 }
 .bootstrap .bg-light {
   background-color: #f8f9fa !important;
@@ -5606,7 +5559,7 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   border-left: 0 !important;
 }
 .bootstrap .border-primary {
-  border-color: #074e9c !important;
+  border-color: #3490dc !important;
 }
 .bootstrap .border-secondary {
   border-color: #6c757d !important;
@@ -5621,7 +5574,7 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   border-color: #ffed4a !important;
 }
 .bootstrap .border-danger {
-  border-color: #d04d4a !important;
+  border-color: #e3342f !important;
 }
 .bootstrap .border-light {
   border-color: #f8f9fa !important;
@@ -8403,10 +8356,10 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   color: #fff !important;
 }
 .bootstrap .text-primary {
-  color: #074e9c !important;
+  color: #3490dc !important;
 }
 .bootstrap a.text-primary:hover, .bootstrap a.text-primary:focus {
-  color: #042953 !important;
+  color: #1d68a7 !important;
 }
 .bootstrap .text-secondary {
   color: #6c757d !important;
@@ -8433,10 +8386,10 @@ a.bootstrap .badge-dark:focus, a.bootstrap .badge-dark.focus {
   color: #fde300 !important;
 }
 .bootstrap .text-danger {
-  color: #d04d4a !important;
+  color: #e3342f !important;
 }
 .bootstrap a.text-danger:hover, .bootstrap a.text-danger:focus {
-  color: #a32d2a !important;
+  color: #ae1c17 !important;
 }
 .bootstrap .text-light {
   color: #f8f9fa !important;
diff --git a/public/admin/js/admin.js b/public/admin/js/admin.js
index 616dd2e..73bfec6 100644
--- a/public/admin/js/admin.js
+++ b/public/admin/js/admin.js
@@ -2172,9 +2172,10 @@ __webpack_require__.r(__webpack_exports__);
 //
 //
 //
+//
 /* harmony default export */ __webpack_exports__["default"] = ({
   name: "CampaignHit",
-  props: ['hit']
+  props: ['hit', 'flip']
 });
 
 /***/ }),
@@ -49663,44 +49664,47 @@ var render = function() {
   var _vm = this
   var _h = _vm.$createElement
   var _c = _vm._self._c || _h
-  return _c("div", { staticClass: "box row" }, [
-    _c("div", { staticClass: "col-sm-4 pl-0" }, [
-      _c("img", {
-        staticClass: "w-100",
-        attrs: { src: _vm.hit.image, alt: "" }
-      })
-    ]),
-    _vm._v(" "),
-    _c("div", { staticClass: "col-sm-8 pt-3" }, [
-      _c(
-        "h3",
-        [
-          _vm.hit._highlightResult === undefined
-            ? _c("span", {
-                domProps: { innerHTML: _vm._s(_vm.hit.organization) }
-              })
-            : _c("ais-highlight", {
-                attrs: { attribute: "organization", hit: _vm.hit }
+  return _vm.hit
+    ? _c("div", { staticClass: "box p-1" }, [
+        _c("div", [
+          _c(
+            "h3",
+            [
+              _vm.hit._highlightResult === undefined
+                ? _c("span", { domProps: { innerHTML: _vm._s(_vm.hit.title) } })
+                : _vm._e(),
+              _vm._v(" "),
+              _c("ais-highlight", {
+                attrs: { attribute: "title", hit: _vm.hit }
               })
-        ],
-        1
-      ),
-      _vm._v(" "),
-      _c(
-        "h4",
-        [
-          _vm.hit._highlightResult === undefined
-            ? _c("span", { domProps: { innerHTML: _vm._s(_vm.hit.title) } })
-            : _vm._e(),
+            ],
+            1
+          )
+        ]),
+        _vm._v(" "),
+        _c("div", { staticClass: "row" }, [
+          _c("div", { class: { "col-sm-6": true, "order-2": _vm.flip } }, [
+            _c("img", {
+              staticClass: "w-100",
+              attrs: { src: _vm.hit.image, alt: "" }
+            })
+          ]),
           _vm._v(" "),
-          _c("ais-highlight", { attrs: { attribute: "title", hit: _vm.hit } })
-        ],
-        1
-      ),
-      _vm._v(" "),
-      _c("p", { domProps: { innerHTML: _vm._s(_vm.hit.description) } })
-    ])
-  ])
+          _c("div", { class: { "col-sm-6": true, "order-1": _vm.flip } }, [
+            _c("p", { domProps: { innerHTML: _vm._s(_vm.hit.description) } }),
+            _vm._v(" "),
+            _c(
+              "a",
+              {
+                staticClass: "click-here",
+                attrs: { href: _vm.hit.url, target: "_blank" }
+              },
+              [_vm._v("Lire ici")]
+            )
+          ])
+        ])
+      ])
+    : _vm._e()
 }
 var staticRenderFns = []
 render._withStripped = true
diff --git a/public/css/app.css b/public/css/app.css
index c49117c..4f8fa61 100644
--- a/public/css/app.css
+++ b/public/css/app.css
@@ -1,9 +1,5 @@
 @import url(https://fonts.googleapis.com/css?family=Nunito);@charset "UTF-8";
 
-/*
- Begin Custom
- */
-
 /*!
  * Bootstrap v4.4.1 (https://getbootstrap.com/)
  * Copyright 2011-2019 The Bootstrap Authors
@@ -12,11 +8,11 @@
  */
 
 :root {
-  --blue: #074e9c;
+  --blue: #3490dc;
   --indigo: #6574cd;
   --purple: #9561e2;
   --pink: #f66d9b;
-  --red: #d04d4a;
+  --red: #e3342f;
   --orange: #f6993f;
   --yellow: #ffed4a;
   --green: #38c172;
@@ -25,12 +21,12 @@
   --white: #fff;
   --gray: #6c757d;
   --gray-dark: #343a40;
-  --primary: #074e9c;
+  --primary: #3490dc;
   --secondary: #6c757d;
   --success: #38c172;
   --info: #6cb2eb;
   --warning: #ffed4a;
-  --danger: #d04d4a;
+  --danger: #e3342f;
   --light: #f8f9fa;
   --dark: #343a40;
   --breakpoint-xs: 0;
@@ -174,13 +170,13 @@ sup {
 }
 
 a {
-  color: #074e9c;
+  color: #3490dc;
   text-decoration: none;
   background-color: transparent;
 }
 
 a:hover {
-  color: #042953;
+  color: #1d68a7;
   text-decoration: underline;
 }
 
@@ -519,7 +515,6 @@ mark,
   background-color: #f8fafc;
   border: 1px solid #dee2e6;
   border-radius: 0.25rem;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.075);
   max-width: 100%;
   height: auto;
 }
@@ -554,14 +549,12 @@ kbd {
   color: #fff;
   background-color: #212529;
   border-radius: 0.2rem;
-  box-shadow: inset 0 -0.1rem 0 rgba(0, 0, 0, 0.25);
 }
 
 kbd kbd {
   padding: 0;
   font-size: 100%;
   font-weight: 700;
-  box-shadow: none;
 }
 
 pre {
@@ -1867,23 +1860,23 @@ pre code {
 .table-primary,
 .table-primary > th,
 .table-primary > td {
-  background-color: #bacde3;
+  background-color: #c6e0f5;
 }
 
 .table-primary th,
 .table-primary td,
 .table-primary thead th,
 .table-primary tbody + tbody {
-  border-color: #7ea3cc;
+  border-color: #95c5ed;
 }
 
 .table-hover .table-primary:hover {
-  background-color: #a8c0dc;
+  background-color: #b0d4f1;
 }
 
 .table-hover .table-primary:hover > td,
 .table-hover .table-primary:hover > th {
-  background-color: #a8c0dc;
+  background-color: #b0d4f1;
 }
 
 .table-secondary,
@@ -1977,23 +1970,23 @@ pre code {
 .table-danger,
 .table-danger > th,
 .table-danger > td {
-  background-color: #f2cdcc;
+  background-color: #f7c6c5;
 }
 
 .table-danger th,
 .table-danger td,
 .table-danger thead th,
 .table-danger tbody + tbody {
-  border-color: #e7a2a1;
+  border-color: #f09593;
 }
 
 .table-hover .table-danger:hover {
-  background-color: #edb9b8;
+  background-color: #f4b0af;
 }
 
 .table-hover .table-danger:hover > td,
 .table-hover .table-danger:hover > th {
-  background-color: #edb9b8;
+  background-color: #f4b0af;
 }
 
 .table-light,
@@ -2168,7 +2161,6 @@ pre code {
   background-clip: padding-box;
   border: 1px solid #ced4da;
   border-radius: 0.25rem;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
   transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
 }
 
@@ -2195,9 +2187,9 @@ pre code {
 .ais-SearchBox-input:focus {
   color: #495057;
   background-color: #fff;
-  border-color: #2d8df6;
+  border-color: #a1cbef;
   outline: 0;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .form-control::-webkit-input-placeholder, .ais-SearchBox-input::-webkit-input-placeholder {
@@ -2497,7 +2489,7 @@ textarea.is-valid.ais-SearchBox-input {
   width: 100%;
   margin-top: 0.25rem;
   font-size: 80%;
-  color: #d04d4a;
+  color: #e3342f;
 }
 
 .invalid-tooltip {
@@ -2511,7 +2503,7 @@ textarea.is-valid.ais-SearchBox-input {
   font-size: 0.7875rem;
   line-height: 1.6;
   color: #fff;
-  background-color: rgba(208, 77, 74, 0.9);
+  background-color: rgba(227, 52, 47, 0.9);
   border-radius: 0.25rem;
 }
 
@@ -2526,9 +2518,9 @@ textarea.is-valid.ais-SearchBox-input {
 .was-validated .ais-SearchBox-input:invalid,
 .form-control.is-invalid,
 .is-invalid.ais-SearchBox-input {
-  border-color: #d04d4a;
+  border-color: #e3342f;
   padding-right: calc(1.6em + 0.75rem);
-  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23d04d4a' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23d04d4a' stroke='none'/%3e%3c/svg%3e");
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e3342f' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e3342f' stroke='none'/%3e%3c/svg%3e");
   background-repeat: no-repeat;
   background-position: right calc(0.4em + 0.1875rem) center;
   background-size: calc(0.8em + 0.375rem) calc(0.8em + 0.375rem);
@@ -2538,8 +2530,8 @@ textarea.is-valid.ais-SearchBox-input {
 .was-validated .ais-SearchBox-input:invalid:focus,
 .form-control.is-invalid:focus,
 .is-invalid.ais-SearchBox-input:focus {
-  border-color: #d04d4a;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  border-color: #e3342f;
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 
 .was-validated textarea.form-control:invalid,
@@ -2552,20 +2544,20 @@ textarea.is-invalid.ais-SearchBox-input {
 
 .was-validated .custom-select:invalid,
 .custom-select.is-invalid {
-  border-color: #d04d4a;
+  border-color: #e3342f;
   padding-right: calc(0.75em + 2.3125rem);
-  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23d04d4a' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23d04d4a' stroke='none'/%3e%3c/svg%3e") #fff no-repeat center right 1.75rem/calc(0.8em + 0.375rem) calc(0.8em + 0.375rem);
+  background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px, url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23e3342f' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23e3342f' stroke='none'/%3e%3c/svg%3e") #fff no-repeat center right 1.75rem/calc(0.8em + 0.375rem) calc(0.8em + 0.375rem);
 }
 
 .was-validated .custom-select:invalid:focus,
 .custom-select.is-invalid:focus {
-  border-color: #d04d4a;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  border-color: #e3342f;
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 
 .was-validated .form-check-input:invalid ~ .form-check-label,
 .form-check-input.is-invalid ~ .form-check-label {
-  color: #d04d4a;
+  color: #e3342f;
 }
 
 .was-validated .form-check-input:invalid ~ .invalid-feedback,
@@ -2577,39 +2569,39 @@ textarea.is-invalid.ais-SearchBox-input {
 
 .was-validated .custom-control-input:invalid ~ .custom-control-label,
 .custom-control-input.is-invalid ~ .custom-control-label {
-  color: #d04d4a;
+  color: #e3342f;
 }
 
 .was-validated .custom-control-input:invalid ~ .custom-control-label::before,
 .custom-control-input.is-invalid ~ .custom-control-label::before {
-  border-color: #d04d4a;
+  border-color: #e3342f;
 }
 
 .was-validated .custom-control-input:invalid:checked ~ .custom-control-label::before,
 .custom-control-input.is-invalid:checked ~ .custom-control-label::before {
-  border-color: #db7572;
-  background-color: #db7572;
+  border-color: #e9605c;
+  background-color: #e9605c;
 }
 
 .was-validated .custom-control-input:invalid:focus ~ .custom-control-label::before,
 .custom-control-input.is-invalid:focus ~ .custom-control-label::before {
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 
 .was-validated .custom-control-input:invalid:focus:not(:checked) ~ .custom-control-label::before,
 .custom-control-input.is-invalid:focus:not(:checked) ~ .custom-control-label::before {
-  border-color: #d04d4a;
+  border-color: #e3342f;
 }
 
 .was-validated .custom-file-input:invalid ~ .custom-file-label,
 .custom-file-input.is-invalid ~ .custom-file-label {
-  border-color: #d04d4a;
+  border-color: #e3342f;
 }
 
 .was-validated .custom-file-input:invalid:focus ~ .custom-file-label,
 .custom-file-input.is-invalid:focus ~ .custom-file-label {
-  border-color: #d04d4a;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.25);
+  border-color: #e3342f;
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.25);
 }
 
 .form-inline {
@@ -2714,23 +2706,12 @@ textarea.is-invalid.ais-SearchBox-input {
 .btn:focus,
 .btn.focus {
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .btn.disabled,
 .btn:disabled {
   opacity: 0.65;
-  box-shadow: none;
-}
-
-.btn:not(:disabled):not(.disabled):active,
-.btn:not(:disabled):not(.disabled).active {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
-}
-
-.btn:not(:disabled):not(.disabled):active:focus,
-.btn:not(:disabled):not(.disabled).active:focus {
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25), inset 0 3px 5px rgba(0, 0, 0, 0.125);
 }
 
 a.btn.disabled,
@@ -2740,51 +2721,49 @@ fieldset:disabled a.btn {
 
 .btn-primary {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 
 .btn-primary:hover {
   color: #fff;
-  background-color: #053c77;
-  border-color: #05366b;
+  background-color: #227dc7;
+  border-color: #2176bd;
 }
 
 .btn-primary:focus,
 .btn-primary.focus {
   color: #fff;
-  background-color: #053c77;
-  border-color: #05366b;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(44, 105, 171, 0.5);
+  background-color: #227dc7;
+  border-color: #2176bd;
+  box-shadow: 0 0 0 0.2rem rgba(82, 161, 225, 0.5);
 }
 
 .btn-primary.disabled,
 .btn-primary:disabled {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 
 .btn-primary:not(:disabled):not(.disabled):active,
 .btn-primary:not(:disabled):not(.disabled).active,
 .show > .btn-primary.dropdown-toggle {
   color: #fff;
-  background-color: #05366b;
-  border-color: #042f5f;
+  background-color: #2176bd;
+  border-color: #1f6fb2;
 }
 
 .btn-primary:not(:disabled):not(.disabled):active:focus,
 .btn-primary:not(:disabled):not(.disabled).active:focus,
 .show > .btn-primary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(44, 105, 171, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(82, 161, 225, 0.5);
 }
 
 .btn-secondary {
   color: #fff;
   background-color: #6c757d;
   border-color: #6c757d;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .btn-secondary:hover {
@@ -2798,7 +2777,7 @@ fieldset:disabled a.btn {
   color: #fff;
   background-color: #5a6268;
   border-color: #545b62;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
 }
 
 .btn-secondary.disabled,
@@ -2819,14 +2798,13 @@ fieldset:disabled a.btn {
 .btn-secondary:not(:disabled):not(.disabled):active:focus,
 .btn-secondary:not(:disabled):not(.disabled).active:focus,
 .show > .btn-secondary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(130, 138, 145, 0.5);
 }
 
 .btn-success {
   color: #fff;
   background-color: #38c172;
   border-color: #38c172;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .btn-success:hover {
@@ -2840,7 +2818,7 @@ fieldset:disabled a.btn {
   color: #fff;
   background-color: #2fa360;
   border-color: #2d995b;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
 }
 
 .btn-success.disabled,
@@ -2861,14 +2839,13 @@ fieldset:disabled a.btn {
 .btn-success:not(:disabled):not(.disabled):active:focus,
 .btn-success:not(:disabled):not(.disabled).active:focus,
 .show > .btn-success.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(86, 202, 135, 0.5);
 }
 
 .btn-info {
   color: #212529;
   background-color: #6cb2eb;
   border-color: #6cb2eb;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .btn-info:hover {
@@ -2882,7 +2859,7 @@ fieldset:disabled a.btn {
   color: #fff;
   background-color: #4aa0e6;
   border-color: #3f9ae5;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
 }
 
 .btn-info.disabled,
@@ -2903,14 +2880,13 @@ fieldset:disabled a.btn {
 .btn-info:not(:disabled):not(.disabled):active:focus,
 .btn-info:not(:disabled):not(.disabled).active:focus,
 .show > .btn-info.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(97, 157, 206, 0.5);
 }
 
 .btn-warning {
   color: #212529;
   background-color: #ffed4a;
   border-color: #ffed4a;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .btn-warning:hover {
@@ -2924,7 +2900,7 @@ fieldset:disabled a.btn {
   color: #212529;
   background-color: #ffe924;
   border-color: #ffe817;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
 }
 
 .btn-warning.disabled,
@@ -2945,56 +2921,54 @@ fieldset:disabled a.btn {
 .btn-warning:not(:disabled):not(.disabled):active:focus,
 .btn-warning:not(:disabled):not(.disabled).active:focus,
 .show > .btn-warning.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(222, 207, 69, 0.5);
 }
 
 .btn-danger {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 
 .btn-danger:hover {
   color: #fff;
-  background-color: #c23532;
-  border-color: #b73330;
+  background-color: #d0211c;
+  border-color: #c51f1a;
 }
 
 .btn-danger:focus,
 .btn-danger.focus {
   color: #fff;
-  background-color: #c23532;
-  border-color: #b73330;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(215, 104, 101, 0.5);
+  background-color: #d0211c;
+  border-color: #c51f1a;
+  box-shadow: 0 0 0 0.2rem rgba(231, 82, 78, 0.5);
 }
 
 .btn-danger.disabled,
 .btn-danger:disabled {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 
 .btn-danger:not(:disabled):not(.disabled):active,
 .btn-danger:not(:disabled):not(.disabled).active,
 .show > .btn-danger.dropdown-toggle {
   color: #fff;
-  background-color: #b73330;
-  border-color: #ad302d;
+  background-color: #c51f1a;
+  border-color: #b91d19;
 }
 
 .btn-danger:not(:disabled):not(.disabled):active:focus,
 .btn-danger:not(:disabled):not(.disabled).active:focus,
 .show > .btn-danger.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(215, 104, 101, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(231, 82, 78, 0.5);
 }
 
 .btn-light {
   color: #212529;
   background-color: #f8f9fa;
   border-color: #f8f9fa;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .btn-light:hover {
@@ -3008,7 +2982,7 @@ fieldset:disabled a.btn {
   color: #212529;
   background-color: #e2e6ea;
   border-color: #dae0e5;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
 }
 
 .btn-light.disabled,
@@ -3029,14 +3003,13 @@ fieldset:disabled a.btn {
 .btn-light:not(:disabled):not(.disabled):active:focus,
 .btn-light:not(:disabled):not(.disabled).active:focus,
 .show > .btn-light.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(216, 217, 219, 0.5);
 }
 
 .btn-dark {
   color: #fff;
   background-color: #343a40;
   border-color: #343a40;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .btn-dark:hover {
@@ -3050,7 +3023,7 @@ fieldset:disabled a.btn {
   color: #fff;
   background-color: #23272b;
   border-color: #1d2124;
-  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
 }
 
 .btn-dark.disabled,
@@ -3071,28 +3044,28 @@ fieldset:disabled a.btn {
 .btn-dark:not(:disabled):not(.disabled):active:focus,
 .btn-dark:not(:disabled):not(.disabled).active:focus,
 .show > .btn-dark.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(82, 88, 93, 0.5);
 }
 
 .btn-outline-primary {
-  color: #074e9c;
-  border-color: #074e9c;
+  color: #3490dc;
+  border-color: #3490dc;
 }
 
 .btn-outline-primary:hover {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 
 .btn-outline-primary:focus,
 .btn-outline-primary.focus {
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.5);
 }
 
 .btn-outline-primary.disabled,
 .btn-outline-primary:disabled {
-  color: #074e9c;
+  color: #3490dc;
   background-color: transparent;
 }
 
@@ -3100,14 +3073,14 @@ fieldset:disabled a.btn {
 .btn-outline-primary:not(:disabled):not(.disabled).active,
 .show > .btn-outline-primary.dropdown-toggle {
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 
 .btn-outline-primary:not(:disabled):not(.disabled):active:focus,
 .btn-outline-primary:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-primary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(7, 78, 156, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.5);
 }
 
 .btn-outline-secondary {
@@ -3143,7 +3116,7 @@ fieldset:disabled a.btn {
 .btn-outline-secondary:not(:disabled):not(.disabled):active:focus,
 .btn-outline-secondary:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-secondary.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(108, 117, 125, 0.5);
 }
 
 .btn-outline-success {
@@ -3179,7 +3152,7 @@ fieldset:disabled a.btn {
 .btn-outline-success:not(:disabled):not(.disabled):active:focus,
 .btn-outline-success:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-success.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(56, 193, 114, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(56, 193, 114, 0.5);
 }
 
 .btn-outline-info {
@@ -3215,7 +3188,7 @@ fieldset:disabled a.btn {
 .btn-outline-info:not(:disabled):not(.disabled):active:focus,
 .btn-outline-info:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-info.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(108, 178, 235, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(108, 178, 235, 0.5);
 }
 
 .btn-outline-warning {
@@ -3251,28 +3224,28 @@ fieldset:disabled a.btn {
 .btn-outline-warning:not(:disabled):not(.disabled):active:focus,
 .btn-outline-warning:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-warning.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(255, 237, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(255, 237, 74, 0.5);
 }
 
 .btn-outline-danger {
-  color: #d04d4a;
-  border-color: #d04d4a;
+  color: #e3342f;
+  border-color: #e3342f;
 }
 
 .btn-outline-danger:hover {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 
 .btn-outline-danger:focus,
 .btn-outline-danger.focus {
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.5);
 }
 
 .btn-outline-danger.disabled,
 .btn-outline-danger:disabled {
-  color: #d04d4a;
+  color: #e3342f;
   background-color: transparent;
 }
 
@@ -3280,14 +3253,14 @@ fieldset:disabled a.btn {
 .btn-outline-danger:not(:disabled):not(.disabled).active,
 .show > .btn-outline-danger.dropdown-toggle {
   color: #fff;
-  background-color: #d04d4a;
-  border-color: #d04d4a;
+  background-color: #e3342f;
+  border-color: #e3342f;
 }
 
 .btn-outline-danger:not(:disabled):not(.disabled):active:focus,
 .btn-outline-danger:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-danger.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(208, 77, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.5);
 }
 
 .btn-outline-light {
@@ -3323,7 +3296,7 @@ fieldset:disabled a.btn {
 .btn-outline-light:not(:disabled):not(.disabled):active:focus,
 .btn-outline-light:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-light.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(248, 249, 250, 0.5);
 }
 
 .btn-outline-dark {
@@ -3359,17 +3332,17 @@ fieldset:disabled a.btn {
 .btn-outline-dark:not(:disabled):not(.disabled):active:focus,
 .btn-outline-dark:not(:disabled):not(.disabled).active:focus,
 .show > .btn-outline-dark.dropdown-toggle:focus {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 58, 64, 0.5);
 }
 
 .btn-link {
   font-weight: 400;
-  color: #074e9c;
+  color: #3490dc;
   text-decoration: none;
 }
 
 .btn-link:hover {
-  color: #042953;
+  color: #1d68a7;
   text-decoration: underline;
 }
 
@@ -3491,7 +3464,6 @@ input[type=button].btn-block {
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.15);
   border-radius: 0.25rem;
-  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.175);
 }
 
 .dropdown-menu-left {
@@ -3677,7 +3649,7 @@ input[type=button].btn-block {
 .dropdown-item:active {
   color: #fff;
   text-decoration: none;
-  background-color: #074e9c;
+  background-color: #3490dc;
 }
 
 .dropdown-item.disabled,
@@ -3787,14 +3759,6 @@ input[type=button].btn-block {
   padding-left: 0.75rem;
 }
 
-.btn-group.show .dropdown-toggle {
-  box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
-}
-
-.btn-group.show .dropdown-toggle.btn-link {
-  box-shadow: none;
-}
-
 .btn-group-vertical {
   flex-direction: column;
   align-items: flex-start;
@@ -4062,24 +4026,22 @@ input[type=button].btn-block {
 
 .custom-control-input:checked ~ .custom-control-label::before {
   color: #fff;
-  border-color: #074e9c;
-  background-color: #074e9c;
-  box-shadow: none;
+  border-color: #3490dc;
+  background-color: #3490dc;
 }
 
 .custom-control-input:focus ~ .custom-control-label::before {
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .custom-control-input:focus:not(:checked) ~ .custom-control-label::before {
-  border-color: #2d8df6;
+  border-color: #a1cbef;
 }
 
 .custom-control-input:not(:disabled):active ~ .custom-control-label::before {
   color: #fff;
-  background-color: #5ea7f8;
-  border-color: #5ea7f8;
-  box-shadow: none;
+  background-color: #cce3f6;
+  border-color: #cce3f6;
 }
 
 .custom-control-input[disabled] ~ .custom-control-label,
@@ -4109,7 +4071,6 @@ input[type=button].btn-block {
   content: "";
   background-color: #fff;
   border: #adb5bd solid 1px;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .custom-control-label::after {
@@ -4132,9 +4093,8 @@ input[type=button].btn-block {
 }
 
 .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::before {
-  border-color: #074e9c;
-  background-color: #074e9c;
-  box-shadow: none;
+  border-color: #3490dc;
+  background-color: #3490dc;
 }
 
 .custom-checkbox .custom-control-input:indeterminate ~ .custom-control-label::after {
@@ -4142,11 +4102,11 @@ input[type=button].btn-block {
 }
 
 .custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 
 .custom-checkbox .custom-control-input:disabled:indeterminate ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 
 .custom-radio .custom-control-label::before {
@@ -4158,7 +4118,7 @@ input[type=button].btn-block {
 }
 
 .custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 
 .custom-switch {
@@ -4194,7 +4154,7 @@ input[type=button].btn-block {
 }
 
 .custom-switch .custom-control-input:disabled:checked ~ .custom-control-label::before {
-  background-color: rgba(7, 78, 156, 0.5);
+  background-color: rgba(52, 144, 220, 0.5);
 }
 
 .custom-select {
@@ -4210,16 +4170,15 @@ input[type=button].btn-block {
   background: #fff url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e") no-repeat right 0.75rem center/8px 10px;
   border: 1px solid #ced4da;
   border-radius: 0.25rem;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075);
   -webkit-appearance: none;
      -moz-appearance: none;
           appearance: none;
 }
 
 .custom-select:focus {
-  border-color: #2d8df6;
+  border-color: #a1cbef;
   outline: 0;
-  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.075), 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .custom-select:focus::-ms-value {
@@ -4282,8 +4241,8 @@ input[type=button].btn-block {
 }
 
 .custom-file-input:focus ~ .custom-file-label {
-  border-color: #2d8df6;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  border-color: #a1cbef;
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .custom-file-input[disabled] ~ .custom-file-label,
@@ -4313,7 +4272,6 @@ input[type=button].btn-block {
   background-color: #fff;
   border: 1px solid #ced4da;
   border-radius: 0.25rem;
-  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
 }
 
 .custom-file-label::after {
@@ -4348,15 +4306,15 @@ input[type=button].btn-block {
 }
 
 .custom-range:focus::-webkit-slider-thumb {
-  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .custom-range:focus::-moz-range-thumb {
-  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .custom-range:focus::-ms-thumb {
-  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 1px #f8fafc, 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .custom-range::-moz-focus-outer {
@@ -4367,10 +4325,9 @@ input[type=button].btn-block {
   width: 1rem;
   height: 1rem;
   margin-top: -0.25rem;
-  background-color: #074e9c;
+  background-color: #3490dc;
   border: 0;
   border-radius: 1rem;
-  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
   -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   -webkit-appearance: none;
@@ -4385,7 +4342,7 @@ input[type=button].btn-block {
 }
 
 .custom-range::-webkit-slider-thumb:active {
-  background-color: #5ea7f8;
+  background-color: #cce3f6;
 }
 
 .custom-range::-webkit-slider-runnable-track {
@@ -4396,16 +4353,14 @@ input[type=button].btn-block {
   background-color: #dee2e6;
   border-color: transparent;
   border-radius: 1rem;
-  box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1);
 }
 
 .custom-range::-moz-range-thumb {
   width: 1rem;
   height: 1rem;
-  background-color: #074e9c;
+  background-color: #3490dc;
   border: 0;
   border-radius: 1rem;
-  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
   -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   -moz-appearance: none;
@@ -4420,7 +4375,7 @@ input[type=button].btn-block {
 }
 
 .custom-range::-moz-range-thumb:active {
-  background-color: #5ea7f8;
+  background-color: #cce3f6;
 }
 
 .custom-range::-moz-range-track {
@@ -4431,7 +4386,6 @@ input[type=button].btn-block {
   background-color: #dee2e6;
   border-color: transparent;
   border-radius: 1rem;
-  box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1);
 }
 
 .custom-range::-ms-thumb {
@@ -4440,10 +4394,9 @@ input[type=button].btn-block {
   margin-top: 0;
   margin-right: 0.2rem;
   margin-left: 0.2rem;
-  background-color: #074e9c;
+  background-color: #3490dc;
   border: 0;
   border-radius: 1rem;
-  box-shadow: 0 0.1rem 0.25rem rgba(0, 0, 0, 0.1);
   -ms-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
   appearance: none;
@@ -4457,7 +4410,7 @@ input[type=button].btn-block {
 }
 
 .custom-range::-ms-thumb:active {
-  background-color: #5ea7f8;
+  background-color: #cce3f6;
 }
 
 .custom-range::-ms-track {
@@ -4468,7 +4421,6 @@ input[type=button].btn-block {
   background-color: transparent;
   border-color: transparent;
   border-width: 0.5rem;
-  box-shadow: inset 0 0.25rem 0.25rem rgba(0, 0, 0, 0.1);
 }
 
 .custom-range::-ms-fill-lower {
@@ -4585,7 +4537,7 @@ input[type=button].btn-block {
 .nav-pills .nav-link.active,
 .nav-pills .show > .nav-link {
   color: #fff;
-  background-color: #074e9c;
+  background-color: #3490dc;
 }
 
 .nav-fill .nav-item {
@@ -5321,14 +5273,14 @@ input[type=button].btn-block {
   padding: 0.5rem 0.75rem;
   margin-left: -1px;
   line-height: 1.25;
-  color: #074e9c;
+  color: #3490dc;
   background-color: #fff;
   border: 1px solid #dee2e6;
 }
 
 .page-link:hover {
   z-index: 2;
-  color: #042953;
+  color: #1d68a7;
   text-decoration: none;
   background-color: #e9ecef;
   border-color: #dee2e6;
@@ -5337,7 +5289,7 @@ input[type=button].btn-block {
 .page-link:focus {
   z-index: 3;
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.25);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.25);
 }
 
 .page-item:first-child .page-link {
@@ -5354,8 +5306,8 @@ input[type=button].btn-block {
 .page-item.active .page-link {
   z-index: 3;
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 
 .page-item.disabled .page-link {
@@ -5439,19 +5391,19 @@ a.badge:focus {
 
 .badge-primary {
   color: #fff;
-  background-color: #074e9c;
+  background-color: #3490dc;
 }
 
 a.badge-primary:hover,
 a.badge-primary:focus {
   color: #fff;
-  background-color: #05366b;
+  background-color: #2176bd;
 }
 
 a.badge-primary:focus,
 a.badge-primary.focus {
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(7, 78, 156, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(52, 144, 220, 0.5);
 }
 
 .badge-secondary {
@@ -5524,19 +5476,19 @@ a.badge-warning.focus {
 
 .badge-danger {
   color: #fff;
-  background-color: #d04d4a;
+  background-color: #e3342f;
 }
 
 a.badge-danger:hover,
 a.badge-danger:focus {
   color: #fff;
-  background-color: #b73330;
+  background-color: #c51f1a;
 }
 
 a.badge-danger:focus,
 a.badge-danger.focus {
   outline: 0;
-  box-shadow: 0 0 0 0.2rem rgba(208, 77, 74, 0.5);
+  box-shadow: 0 0 0 0.2rem rgba(227, 52, 47, 0.5);
 }
 
 .badge-light {
@@ -5621,17 +5573,17 @@ a.badge-dark.focus {
 }
 
 .alert-primary {
-  color: #042951;
-  background-color: #cddceb;
-  border-color: #bacde3;
+  color: #1b4b72;
+  background-color: #d6e9f8;
+  border-color: #c6e0f5;
 }
 
 .alert-primary hr {
-  border-top-color: #a8c0dc;
+  border-top-color: #b0d4f1;
 }
 
 .alert-primary .alert-link {
-  color: #021020;
+  color: #113049;
 }
 
 .alert-secondary {
@@ -5691,17 +5643,17 @@ a.badge-dark.focus {
 }
 
 .alert-danger {
-  color: #6c2826;
-  background-color: #f6dbdb;
-  border-color: #f2cdcc;
+  color: #761b18;
+  background-color: #f9d6d5;
+  border-color: #f7c6c5;
 }
 
 .alert-danger hr {
-  border-top-color: #edb9b8;
+  border-top-color: #f4b0af;
 }
 
 .alert-danger .alert-link {
-  color: #461a19;
+  color: #4c110f;
 }
 
 .alert-light {
@@ -5759,7 +5711,6 @@ a.badge-dark.focus {
   font-size: 0.675rem;
   background-color: #e9ecef;
   border-radius: 0.25rem;
-  box-shadow: inset 0 0.1rem 0.1rem rgba(0, 0, 0, 0.1);
 }
 
 .progress-bar {
@@ -5770,7 +5721,7 @@ a.badge-dark.focus {
   color: #fff;
   text-align: center;
   white-space: nowrap;
-  background-color: #074e9c;
+  background-color: #3490dc;
   transition: width 0.6s ease;
 }
 
@@ -5860,8 +5811,8 @@ a.badge-dark.focus {
 .list-group-item.active {
   z-index: 2;
   color: #fff;
-  background-color: #074e9c;
-  border-color: #074e9c;
+  background-color: #3490dc;
+  border-color: #3490dc;
 }
 
 .list-group-item + .list-group-item {
@@ -6036,20 +5987,20 @@ a.badge-dark.focus {
 }
 
 .list-group-item-primary {
-  color: #042951;
-  background-color: #bacde3;
+  color: #1b4b72;
+  background-color: #c6e0f5;
 }
 
 .list-group-item-primary.list-group-item-action:hover,
 .list-group-item-primary.list-group-item-action:focus {
-  color: #042951;
-  background-color: #a8c0dc;
+  color: #1b4b72;
+  background-color: #b0d4f1;
 }
 
 .list-group-item-primary.list-group-item-action.active {
   color: #fff;
-  background-color: #042951;
-  border-color: #042951;
+  background-color: #1b4b72;
+  border-color: #1b4b72;
 }
 
 .list-group-item-secondary {
@@ -6121,20 +6072,20 @@ a.badge-dark.focus {
 }
 
 .list-group-item-danger {
-  color: #6c2826;
-  background-color: #f2cdcc;
+  color: #761b18;
+  background-color: #f7c6c5;
 }
 
 .list-group-item-danger.list-group-item-action:hover,
 .list-group-item-danger.list-group-item-action:focus {
-  color: #6c2826;
-  background-color: #edb9b8;
+  color: #761b18;
+  background-color: #f4b0af;
 }
 
 .list-group-item-danger.list-group-item-action.active {
   color: #fff;
-  background-color: #6c2826;
-  border-color: #6c2826;
+  background-color: #761b18;
+  border-color: #761b18;
 }
 
 .list-group-item-light {
@@ -6351,7 +6302,6 @@ a.close.disabled {
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.2);
   border-radius: 0.3rem;
-  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.5);
   outline: 0;
 }
 
@@ -6444,10 +6394,6 @@ a.close.disabled {
     height: calc(100vh - 3.5rem);
   }
 
-  .modal-content {
-    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.5);
-  }
-
   .modal-sm {
     max-width: 300px;
   }
@@ -6616,7 +6562,6 @@ a.close.disabled {
   background-clip: padding-box;
   border: 1px solid rgba(0, 0, 0, 0.2);
   border-radius: 0.3rem;
-  box-shadow: 0 0.25rem 0.5rem rgba(0, 0, 0, 0.2);
 }
 
 .popover .arrow {
@@ -7051,14 +6996,14 @@ a.close.disabled {
 }
 
 .bg-primary {
-  background-color: #074e9c !important;
+  background-color: #3490dc !important;
 }
 
 a.bg-primary:hover,
 a.bg-primary:focus,
 button.bg-primary:hover,
 button.bg-primary:focus {
-  background-color: #05366b !important;
+  background-color: #2176bd !important;
 }
 
 .bg-secondary {
@@ -7106,14 +7051,14 @@ button.bg-warning:focus {
 }
 
 .bg-danger {
-  background-color: #d04d4a !important;
+  background-color: #e3342f !important;
 }
 
 a.bg-danger:hover,
 a.bg-danger:focus,
 button.bg-danger:hover,
 button.bg-danger:focus {
-  background-color: #b73330 !important;
+  background-color: #c51f1a !important;
 }
 
 .bg-light {
@@ -7187,7 +7132,7 @@ button.bg-dark:focus {
 }
 
 .border-primary {
-  border-color: #074e9c !important;
+  border-color: #3490dc !important;
 }
 
 .border-secondary {
@@ -7207,7 +7152,7 @@ button.bg-dark:focus {
 }
 
 .border-danger {
-  border-color: #d04d4a !important;
+  border-color: #e3342f !important;
 }
 
 .border-light {
@@ -10767,12 +10712,12 @@ button.bg-dark:focus {
 }
 
 .text-primary {
-  color: #074e9c !important;
+  color: #3490dc !important;
 }
 
 a.text-primary:hover,
 a.text-primary:focus {
-  color: #042953 !important;
+  color: #1d68a7 !important;
 }
 
 .text-secondary {
@@ -10812,12 +10757,12 @@ a.text-warning:focus {
 }
 
 .text-danger {
-  color: #d04d4a !important;
+  color: #e3342f !important;
 }
 
 a.text-danger:hover,
 a.text-danger:focus {
-  color: #a32d2a !important;
+  color: #ae1c17 !important;
 }
 
 .text-light {
@@ -11101,23 +11046,61 @@ mark.mark {
   font-display: swap;
 }
 
-.box {
-  box-shadow: 0 2px 0 rgba(90, 97, 105, 0.11), 0 4px 8px rgba(90, 97, 105, 0.12), 0 10px 10px rgba(90, 97, 105, 0.06), 0 7px 70px rgba(90, 97, 105, 0.1);
+.blue {
+  color: #074e9c;
 }
 
-.header-logo {
-  width: 90%;
-  max-width: 850px;
-  display: block;
-  margin: 1em auto;
+.highlight-blue {
+  color: white;
+  background-color: #074e9c;
 }
 
-a {
-  color: #074e9c !important;
+.border-blue {
+  border: 1px solid #074e9c;
+}
+
+.purple {
+  color: #AD5ED3;
+}
+
+.highlight-purple {
+  color: white;
+  background-color: #AD5ED3;
+}
+
+.border-purple {
+  border: 1px solid #AD5ED3;
+}
+
+.red {
+  color: #d04d4a;
+}
+
+.highlight-red,
+h1 {
+  color: white;
+  background-color: #d04d4a;
+}
+
+.border-red {
+  border: 1px solid #d04d4a;
+}
+
+.cyan {
+  color: #288ed7;
+}
+
+.highlight-cyan {
+  color: white;
+  background-color: #288ed7;
+}
+
+.border-cyan {
+  border: 1px solid #288ed7;
 }
 
 nav {
-  margin-bottom: 1.5rem;
+  margin-bottom: 0.5rem;
   display: flex;
   justify-content: space-around;
 }
@@ -11143,25 +11126,6 @@ nav p {
   word-break: break-word;
 }
 
-.highlight-purple {
-  color: white;
-  background-color: #AD5ED3;
-}
-
-.purple {
-  color: #AD5ED3;
-}
-
-.highlight-red,
-h1 {
-  color: white;
-  background-color: #d04d4a;
-}
-
-.red {
-  color: #d04d4a;
-}
-
 h1 {
   text-transform: uppercase;
   margin: auto auto 1rem;
@@ -11183,33 +11147,11 @@ h2.bold {
   font-size: large;
 }
 
-ul.leaders {
-  padding: 0;
-  overflow-x: hidden;
-  list-style: none;
+h3 {
+  font-size: medium;
   color: #074e9c;
 }
 
-ul.leaders li:after {
-  float: left;
-  width: 0;
-  white-space: nowrap;
-  content: "• • • • • • • • • • • • • • • • • • • • " "• • • • • • • • • • • • • • • • • • • • " "• • • • • • • • • • • • • • • • • • • • " "• • • • • • • • • • • • • • • • • • • • ";
-}
-
-ul.leaders span {
-  text-transform: uppercase;
-}
-
-ul.leaders span {
-  float: right;
-  padding-left: 0.33em;
-  background: #f8fafc;
-  position: relative;
-  z-index: 1;
-  font-family: "Avenir Next Demi", sans-serif;
-}
-
 div.cover {
   position: relative;
 }
@@ -11267,43 +11209,93 @@ div.cover .cover-title p {
 
 div.pill-box {
   position: relative;
-  margin-top: 2rem;
-  margin-bottom: 2rem;
 }
 
 div.pill-box img {
-  width: 50px;
-  left: -20px;
+  width: 60px;
+  left: -15px;
   top: -20px;
   position: absolute;
   z-index: 2;
 }
 
 div.pill-box div {
-  background-color: rgba(208, 77, 74, 0.2);
   border-radius: 5px;
-  box-shadow: 4px 5px 11px 1px #aaa;
-  padding: 5px;
-  border: 1px solid #d04d4a;
+  padding: 0 5px 5px;
 }
 
 div.pill-box div h2 {
-  padding: 0 30px;
-  color: #d04d4a;
+  padding: 2px 10px 1px 50px;
+  margin: 0 -6px;
+  background-color: #074e9c;
+  color: white;
   text-align: center;
+  width: -webkit-fit-content;
+  width: -moz-fit-content;
+  width: fit-content;
+  position: relative;
+  top: -1px;
+  font-size: medium;
 }
 
 div.pill-box div > p {
   padding: 5px 10px 0 10px;
   margin-bottom: 0.5rem;
-  text-align: center;
 }
 
+ul.leaders {
+  padding: 0;
+  overflow-x: hidden;
+  list-style: none;
+  color: #074e9c;
+}
+
+ul.leaders li:after {
+  float: left;
+  width: 0;
+  white-space: nowrap;
+  content: "• • • • • • • • • • • • • • • • • • • • " "• • • • • • • • • • • • • • • • • • • • " "• • • • • • • • • • • • • • • • • • • • " "• • • • • • • • • • • • • • • • • • • • ";
+}
+
+ul.leaders span {
+  text-transform: uppercase;
+}
+
+ul.leaders span:first-child {
+  padding-right: 0.5em;
+  background: #f8fafc;
+}
+
+ul.leaders span + span {
+  float: right;
+  padding-left: 0.33em;
+  background: #f8fafc;
+  position: relative;
+  z-index: 1;
+  font-family: "Avenir Next Demi", sans-serif;
+}
+
+.box,
+div.pill-box div {
+  box-shadow: 0 2px 0 rgba(90, 97, 105, 0.11), 0 4px 8px rgba(90, 97, 105, 0.12), 0 10px 10px rgba(90, 97, 105, 0.06), 0 7px 70px rgba(90, 97, 105, 0.1);
+}
+
+.header-logo {
+  width: 90%;
+  max-width: 850px;
+  display: block;
+  margin: 1em auto;
+}
+
+a {
+  color: #074e9c !important;
+  text-transform: uppercase;
+}
+
+.click-here,
 div.pill-box div > a {
   text-align: right;
-  text-transform: uppercase;
   font-weight: bold;
-  color: #d04d4a !important;
   margin-bottom: 0;
   display: block;
 }
diff --git a/public/img/podcasts/microphone-temporary.png b/public/img/podcasts/microphone-temporary.png
new file mode 100644
index 0000000..9f675df
Binary files /dev/null and b/public/img/podcasts/microphone-temporary.png differ
diff --git a/public/js/app.js b/public/js/app.js
index f6c1f3b..1e7d54d 100644
--- a/public/js/app.js
+++ b/public/js/app.js
@@ -7367,9 +7367,10 @@ __webpack_require__.r(__webpack_exports__);
 //
 //
 //
+//
 /* harmony default export */ __webpack_exports__["default"] = ({
   name: "CampaignHit",
-  props: ['hit']
+  props: ['hit', 'flip']
 });
 
 /***/ }),
@@ -79143,44 +79144,47 @@ var render = function() {
   var _vm = this
   var _h = _vm.$createElement
   var _c = _vm._self._c || _h
-  return _c("div", { staticClass: "box row" }, [
-    _c("div", { staticClass: "col-sm-4 pl-0" }, [
-      _c("img", {
-        staticClass: "w-100",
-        attrs: { src: _vm.hit.image, alt: "" }
-      })
-    ]),
-    _vm._v(" "),
-    _c("div", { staticClass: "col-sm-8 pt-3" }, [
-      _c(
-        "h3",
-        [
-          _vm.hit._highlightResult === undefined
-            ? _c("span", {
-                domProps: { innerHTML: _vm._s(_vm.hit.organization) }
-              })
-            : _c("ais-highlight", {
-                attrs: { attribute: "organization", hit: _vm.hit }
+  return _vm.hit
+    ? _c("div", { staticClass: "box p-1" }, [
+        _c("div", [
+          _c(
+            "h3",
+            [
+              _vm.hit._highlightResult === undefined
+                ? _c("span", { domProps: { innerHTML: _vm._s(_vm.hit.title) } })
+                : _vm._e(),
+              _vm._v(" "),
+              _c("ais-highlight", {
+                attrs: { attribute: "title", hit: _vm.hit }
               })
-        ],
-        1
-      ),
-      _vm._v(" "),
-      _c(
-        "h4",
-        [
-          _vm.hit._highlightResult === undefined
-            ? _c("span", { domProps: { innerHTML: _vm._s(_vm.hit.title) } })
-            : _vm._e(),
+            ],
+            1
+          )
+        ]),
+        _vm._v(" "),
+        _c("div", { staticClass: "row" }, [
+          _c("div", { class: { "col-sm-6": true, "order-2": _vm.flip } }, [
+            _c("img", {
+              staticClass: "w-100",
+              attrs: { src: _vm.hit.image, alt: "" }
+            })
+          ]),
           _vm._v(" "),
-          _c("ais-highlight", { attrs: { attribute: "title", hit: _vm.hit } })
-        ],
-        1
-      ),
-      _vm._v(" "),
-      _c("p", { domProps: { innerHTML: _vm._s(_vm.hit.description) } })
-    ])
-  ])
+          _c("div", { class: { "col-sm-6": true, "order-1": _vm.flip } }, [
+            _c("p", { domProps: { innerHTML: _vm._s(_vm.hit.description) } }),
+            _vm._v(" "),
+            _c(
+              "a",
+              {
+                staticClass: "click-here",
+                attrs: { href: _vm.hit.url, target: "_blank" }
+              },
+              [_vm._v("Lire ici")]
+            )
+          ])
+        ])
+      ])
+    : _vm._e()
 }
 var staticRenderFns = []
 render._withStripped = true
diff --git a/resources/js/components/AdCampaign/CampaignHit.vue b/resources/js/components/AdCampaign/CampaignHit.vue
index 2d8273b..aad4840 100644
--- a/resources/js/components/AdCampaign/CampaignHit.vue
+++ b/resources/js/components/AdCampaign/CampaignHit.vue
@@ -1,21 +1,22 @@
 <template>
-    <div class="box row">
-        <div class="col-sm-4 pl-0">
-            <img class="w-100" :src="hit.image" alt="">
-        </div>
-        <div class="col-sm-8 pt-3">
+    <div class="box p-1" v-if="hit">
 
+        <div>
             <h3>
-                <span v-if="hit._highlightResult === undefined" v-html="hit.organization"></span>
-                <ais-highlight v-else attribute="organization" :hit="hit" />
-            </h3>
-            <h4>
                 <span v-if="hit._highlightResult === undefined" v-html="hit.title"></span>
                 <ais-highlight attribute="title" :hit="hit" />
-            </h4>
-            <p v-html="hit.description"></p>
+            </h3>
 
         </div>
+        <div class="row">
+            <div :class="{'col-sm-6': true, 'order-2' : flip}">
+                <img class="w-100" :src="hit.image" alt="">
+            </div>
+            <div :class="{'col-sm-6': true, 'order-1' : flip}">
+                <p v-html="hit.description"></p>
+                <a :href="hit.url" target="_blank" class="click-here">Lire ici</a>
+            </div>
+        </div>
 
     </div>
 
@@ -24,7 +25,7 @@
 <script>
     export default {
         name: "CampaignHit",
-        props: ['hit'],
+        props: ['hit', 'flip'],
     }
 </script>
 
diff --git a/resources/sass/_colors.scss b/resources/sass/_colors.scss
new file mode 100644
index 0000000..c3498bf
--- /dev/null
+++ b/resources/sass/_colors.scss
@@ -0,0 +1,59 @@
+
+// PSQ COLORS
+$psq_red: #d04d4a;
+$psq_blue: #074e9c;
+$psq_light_blue: #cddceb; //$psq_blue, opacity 0.3 white bg
+$psq_purple: #AD5ED3;
+$psq_cyan: #288ed7;
+
+
+// BOOTSTRAP VARS
+$blue: $psq_blue;
+$red: $psq_red;
+
+$enable-shadows: true;
+
+
+//CLASS HELPERS
+
+$psq_colors: ("blue" : $psq_blue, "purple" : $psq_purple, "red" : $psq_red, "cyan" : $psq_cyan);
+
+
+
+@each $name, $color in $psq_colors {
+    .#{$name} {
+        color: $color;
+    }
+
+    .highlight-#{$name} {
+        color: white;
+        background-color: $color;
+    }
+    .border-#{$name} {
+        border: 1px solid $color;
+    }
+}
+
+//
+//.highlight-purple {
+//    color: white;
+//    background-color: $psq_purple;
+//}
+//
+//.purple {
+//    color: $psq_purple;
+//}
+//
+//.highlight-red {
+//    color: white;
+//    background-color: $psq_red;
+//}
+//
+//.red {
+//    color: $psq_red;
+//}
+//
+//.cyan {
+//    $color: $psq_cyan;
+//}
+//
diff --git a/resources/sass/_covers.scss b/resources/sass/_covers.scss
new file mode 100644
index 0000000..35443b3
--- /dev/null
+++ b/resources/sass/_covers.scss
@@ -0,0 +1,62 @@
+
+div.cover {
+    position: relative;
+
+    img.cover-bg {
+        width: 100%;
+    }
+
+
+
+    &.cover-pile-2 {
+        img.cover-over {
+            width: 71%;
+            left: 15%;
+            top: 3%;
+        }
+    }
+
+    &.cover-pile-3 {
+        img.cover-over {
+            width: 60%;
+            left: 20%;
+            top: 5%;
+        }
+    }
+
+    img.cover-over {
+        position: absolute;
+    }
+
+    .cover-title {
+
+        width: fit-content;
+        margin: auto;
+        position: relative;
+        height: 30px;
+
+        img {
+            position: absolute;
+            width: 50px;
+            z-index: 5;
+            top: -12px;
+            left: -30px;
+
+        }
+
+        p {
+            text-transform: uppercase;
+            color: $psq_blue;
+            background-color: $psq_light_blue;
+            text-align: center;
+            font-weight: 900;
+            display: table;
+            margin: auto;
+            padding: 0 6px;
+            font-size: small;
+            z-index: 10;
+            position: relative;
+        }
+    }
+}
+
diff --git a/resources/sass/_headers.scss b/resources/sass/_headers.scss
new file mode 100644
index 0000000..ad827ec
--- /dev/null
+++ b/resources/sass/_headers.scss
@@ -0,0 +1,29 @@
+
+h1 {
+    @extend .highlight-red;
+    text-transform: uppercase;
+    margin: auto auto 1rem;
+    text-align: center;
+    display: table;
+    font-size: x-large;
+    padding: 6px 8px 4px;
+
+}
+
+h2 {
+    font-weight: 500;
+    font-size: medium;
+    text-transform: uppercase;
+    color: $psq_blue;
+}
+
+h2.bold {
+    font-weight: bold;
+    font-size: large;
+}
+
+h3 {
+    font-size: medium;
+    color: $psq_blue;
+
+}
diff --git a/resources/sass/_nav.scss b/resources/sass/_nav.scss
new file mode 100644
index 0000000..4ae2868
--- /dev/null
+++ b/resources/sass/_nav.scss
@@ -0,0 +1,29 @@
+nav {
+    margin-bottom: .5rem;
+    display: flex;
+    justify-content: space-around;
+
+    > div {
+        @extend .px-md-3;
+        flex: 1 1 0;
+        text-align: center;
+        padding: 5px;
+        width: 0;
+    }
+
+    img {
+        max-width: 100px;
+        margin-bottom: 1rem;
+    }
+
+    p {
+        @extend .d-lg-block;
+        display: none;
+        font-size: small;
+        font-weight: 500;
+        text-transform: uppercase;
+        text-align: center;
+        word-break: break-word;
+    }
+
+}
diff --git a/resources/sass/_pill_boxes.scss b/resources/sass/_pill_boxes.scss
new file mode 100644
index 0000000..87c1542
--- /dev/null
+++ b/resources/sass/_pill_boxes.scss
@@ -0,0 +1,46 @@
+
+div.pill-box {
+    position: relative;
+
+
+    img {
+        width: 60px;
+        left: -15px;
+        top: -20px;
+        position: absolute;
+        z-index: 2;
+    }
+
+    div {
+        //background-color: rgba(208, 77, 74, 0.2);
+        @extend .box;
+        border-radius: 5px;
+        padding: 0 5px 5px;
+        //border: 1px solid $psq_red;
+
+        h2 {
+            padding: 2px 10px 1px 50px;
+            margin: 0 -6px;
+            background-color: $psq_blue;
+            color: white;
+            text-align: center;
+            width: fit-content;
+            position: relative;
+            top: -1px;
+            font-size: medium;
+
+        }
+
+        > p {
+            padding: 5px 10px 0 10px;
+            margin-bottom: 0.5rem;
+            //text-align: center;
+
+        }
+
+        > a {
+            @extend .click-here;
+        }
+    }
+
+}
diff --git a/resources/sass/_title_dots.scss b/resources/sass/_title_dots.scss
new file mode 100644
index 0000000..17938be
--- /dev/null
+++ b/resources/sass/_title_dots.scss
@@ -0,0 +1,40 @@
+
+ul.leaders {
+    padding: 0;
+    overflow-x: hidden;
+    list-style: none;
+    color: $psq_blue;
+
+    li:after {
+        float: left;
+        width: 0;
+        white-space: nowrap;
+        content: "• • • • • • • • • • • • • • • • • • • • "
+        "• • • • • • • • • • • • • • • • • • • • "
+        "• • • • • • • • • • • • • • • • • • • • "
+        "• • • • • • • • • • • • • • • • • • • • ";
+    }
+
+    span {
+        text-transform: uppercase;
+    }
+
+    //Uncomment to allow leading span
+
+    span:first-child {
+        padding-right: 0.5em;
+        //font-size: 2em;
+        background: $body-bg;
+    }
+
+    span + span  {
+        float: right;
+        padding-left: 0.33em;
+        background: $body-bg;
+        position: relative;
+        z-index: 1;
+        font-family: "Avenir Next Demi",sans-serif;
+
+    }
+}
+
diff --git a/resources/sass/_variables.scss b/resources/sass/_variables.scss
index 3d518e3..766225a 100644
--- a/resources/sass/_variables.scss
+++ b/resources/sass/_variables.scss
@@ -19,19 +19,3 @@ $green: #38c172;
 $teal: #4dc0b5;
 $cyan: #6cb2eb;
 
-
-/*
- Begin Custom
- */
-
-$psq_red: #d04d4a;
-$psq_blue: #074e9c;
-$psq_light_blue: #cddceb; //$psq_blue, opacity 0.3 white bg
-$psq_purple: #AD5ED3;
-
-
-
-$blue: $psq_blue;
-$red: $psq_red;
-
-$enable-shadows: true;
diff --git a/resources/sass/app.scss b/resources/sass/app.scss
index ed3c370..7f67392 100644
--- a/resources/sass/app.scss
+++ b/resources/sass/app.scss
@@ -4,7 +4,12 @@
 @import '~bootstrap/scss/bootstrap';
 @import "ais";
 @import "fonts";
-
+@import "colors";
+@import "nav";
+@import "headers";
+@import "covers";
+@import "pill_boxes";
+@import "title_dots";
 
 .box {
     box-shadow: 0 2px 0 rgba(90, 97, 105, 0.11),
@@ -22,245 +27,15 @@
 
 a {
     color: $psq_blue !important;
-}
-
-//nav
-
-nav {
-    margin-bottom: 1.5rem;
-    display: flex;
-    justify-content: space-around;
-
-    > div {
-        @extend .px-md-3;
-        flex: 1 1 0;
-        text-align: center;
-        padding: 5px;
-        width: 0;
-    }
-
-    img {
-        max-width: 100px;
-        margin-bottom: 1rem;
-
-    }
-
-    p {
-        @extend .d-lg-block;
-        display: none;
-        font-size: small;
-        font-weight: 500;
-        text-transform: uppercase;
-        text-align: center;
-        word-break: break-word;
-    }
-
-}
-
-
-//COLORS
-.highlight-purple {
-    color: white;
-    background-color: $psq_purple;
-}
-
-.purple {
-    color: $psq_purple;
-}
-
-.highlight-red {
-    color: white;
-    background-color: $psq_red;
-}
-
-.red {
-    color: $psq_red;
-}
-
-//HEADERS
-
-h1 {
-    @extend .highlight-red;
     text-transform: uppercase;
-    margin: auto auto 1rem;
-    text-align: center;
-    display: table;
-    font-size: x-large;
-    padding: 6px 8px 4px;
 
 }
 
-h2 {
-    font-weight: 500;
-    font-size: medium;
-    text-transform: uppercase;
-    color: $psq_blue;
-}
-
-h2.bold {
+.click-here {
+    text-align: right;
     font-weight: bold;
-    font-size: large;
-}
-
-h3 {
-
-}
-
-//TITLE DOTS
-
-ul.leaders {
-    padding: 0;
-    overflow-x: hidden;
-    list-style: none;
-    color: $psq_blue;
-
-    li:after {
-        float: left;
-        width: 0;
-        white-space: nowrap;
-        content: "• • • • • • • • • • • • • • • • • • • • "
-        "• • • • • • • • • • • • • • • • • • • • "
-        "• • • • • • • • • • • • • • • • • • • • "
-        "• • • • • • • • • • • • • • • • • • • • ";
-    }
-
-    span {
-        text-transform: uppercase;
-    }
-
-    //Uncomment to allow leading span
-
-    //span:first-child {
-    //    padding-right: 0.33em;
-    //    font-size: 2em;
-    //    background: $body-bg;
-    //}
-
-    span /* + span */ {
-        float: right;
-        padding-left: 0.33em;
-        background: $body-bg;
-        position: relative;
-        z-index: 1;
-        font-family: "Avenir Next Demi",sans-serif;
-
-    }
-}
-
-
-
-//COVERS
-
-div.cover {
-    position: relative;
-
-    img.cover-bg {
-        width: 100%;
-    }
-
-
-
-    &.cover-pile-2 {
-        img.cover-over {
-            width: 71%;
-            left: 15%;
-            top: 3%;
-        }
-    }
-
-    &.cover-pile-3 {
-        img.cover-over {
-            width: 60%;
-            left: 20%;
-            top: 5%;
-        }
-    }
-
-    img.cover-over {
-        position: absolute;
-    }
-
-    .cover-title {
-
-        width: fit-content;
-        margin: auto;
-        position: relative;
-        height: 30px;
-
-        img {
-            position: absolute;
-            width: 50px;
-            z-index: 5;
-            top: -12px;
-            left: -30px;
-
-        }
-
-        p {
-            text-transform: uppercase;
-            color: $psq_blue;
-            background-color: $psq_light_blue;
-            text-align: center;
-            font-weight: 900;
-            display: table;
-            margin: auto;
-            padding: 0 6px;
-            font-size: small;
-            z-index: 10;
-            position: relative;
-        }
-    }
-}
-
-
-
-//PILL BOXES
-
-div.pill-box {
-    position: relative;
-    margin-top: 2rem;
-    margin-bottom: 2rem;
-
-
-    img {
-        width: 50px;
-        left: -20px;
-        top: -20px;
-        position: absolute;
-        z-index: 2;
-    }
-
-    div {
-        background-color: rgba(208, 77, 74, 0.2);
-        border-radius: 5px;
-        box-shadow: 4px 5px 11px 1px #aaa;
-        padding: 5px;
-        border: 1px solid $psq_red;
-
-        h2 {
-            padding: 0 30px;
-            color: $psq_red;
-            text-align: center;
-        }
-
-        > p {
-            padding: 5px 10px 0 10px;
-            margin-bottom: 0.5rem;
-            text-align: center;
-
-        }
-
-        > a {
-            text-align: right;
-            text-transform: uppercase;
-            font-weight: bold;
-            color: $psq_red !important;
-            margin-bottom: 0;
-            display: block;
-
-        }
-    }
-
+    margin-bottom: 0;
+    display: block;
 }
 
 
@@ -277,3 +52,4 @@ div.pill-box {
         font-size: small;
     }
 }
+
diff --git a/resources/views/adCampaigns/index.blade.php b/resources/views/adCampaigns/index.blade.php
index 55e6faf..b98a9de 100644
--- a/resources/views/adCampaigns/index.blade.php
+++ b/resources/views/adCampaigns/index.blade.php
@@ -1,38 +1,37 @@
 @extends('layouts.app')
-
 @section('content')
-<div class="container">
-    <h1 class="highlight-purple">CAMPAGNES & COMMUNICATION DES ACTEURS DE LA SANTÉ</h1>
 
-    <ul class="leaders">
-        <li><span>MARKETING & COM : LES CAMPAGNES DE LA SEMAINE</span></li>
-    </ul>
+<div class="container campaign">
+    <h1 class="highlight-purple">marketing & com : les campagnes de la semaine</h1>
+
 
     <div class="row">
-        @foreach($campaigns as $campaign)
-            <div class="col-12 mb-4">
-                <campaign-hit :hit='@json($campaign)'></campaign-hit>
-            </div>
+        <div class="col-md-8 mb-4">
+            <campaign-hit :hit='@json($campaigns->pop())'></campaign-hit>
+        </div>
+        <div class="col-md-4 mb-4">
+            <x-pill-box title="Consultez ici notre page agenda" color="purple">
+                Haec dum oriens diu perferret, caeli reserato tepore Constantius consulatu suo septies et Caesaris ter egressus Arelate Valentiam petit, in Gundomadum et Vadomarium fratres Alamannorum reges arma moturus, quorum crebris excursibus vastabantur confines limitibus terrae Gallorum.
+            </x-pill-box>
 
-        @endforeach
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-md-4 mb-4">
+            <x-pill-box title="Consultez ici notre page agenda" color="purple">
+                Haec dum oriens diu perferret, caeli reserato tepore Constantius consulatu suo septies et Caesaris ter egressus Arelate Valentiam petit, in Gundomadum et Vadomarium fratres Alamannorum reges arma moturus, quorum crebris excursibus vastabantur confines limitibus terrae Gallorum.
+            </x-pill-box>
+        </div>
+        <div class="col-md-8 mb-4">
+            <campaign-hit :hit='@json($campaigns->pop())' :flip="true"></campaign-hit>
+        </div>
+    </div>
+    <div class="row">
+        <div class="col-md-12">
+            <campaign-hit :hit='@json($campaigns->pop())'></campaign-hit>
+        </div>
     </div>
 
 
 </div>
 @endsection
-<script>
-    import CampaignHit from "../../js/components/AdCampaign/CampaignHit";
-    export default {
-        components: {CampaignHit},
-        data() {
-            return {
-                hit: {
-                    organization: 'test orga',
-                    title: 'test title',
-                    image: '#',
-                    description: 'descr'
-                }
-            }
-        }
-    }
-</script>
diff --git a/resources/views/admin/blocks/guests.blade.php b/resources/views/admin/blocks/guests.blade.php
index 4625413..0067c38 100644
--- a/resources/views/admin/blocks/guests.blade.php
+++ b/resources/views/admin/blocks/guests.blade.php
@@ -3,7 +3,7 @@
 @twillRepeaterTrigger('Ajouter un invité')
 @twillRepeaterGroup('app')
 @formField('medias', [
-    'name' => 'image',
+    'name' => 'profile',
     'label' => 'Photo',
     'withVideoUrl' => false,
     'max' => 1,
diff --git a/resources/views/admin/guests/form.blade.php b/resources/views/admin/guests/form.blade.php
new file mode 100644
index 0000000..4fec917
--- /dev/null
+++ b/resources/views/admin/guests/form.blade.php
@@ -0,0 +1,10 @@
+@extends('twill::layouts.form')
+
+@section('contentFields')
+    @formField('input', [
+        'name' => 'description',
+        'label' => 'Description',
+        'translated' => true,
+        'maxlength' => 100
+    ])
+@stop
diff --git a/resources/views/admin/podcasts/form.blade.php b/resources/views/admin/podcasts/form.blade.php
index f77c9ca..2ab32c7 100644
--- a/resources/views/admin/podcasts/form.blade.php
+++ b/resources/views/admin/podcasts/form.blade.php
@@ -7,6 +7,10 @@
         [
             'fieldset' => 'sponsor',
             'label' => 'Partenaire',
+        ],
+        [
+            'fieldset' => 'file',
+            'label' => 'Fichier',
         ]
     ]
 ])
@@ -53,4 +57,14 @@
 
     @endcomponent
 
+    @component('twill::partials.form.utils._fieldset', ['id' => 'file', 'title' => 'Fichier audio'])
+        @formField('files', [
+            'name' => 'file',
+            'label' => 'Fichier audio',
+            'max' => 1
+        ])
+
+    @endcomponent
+
+
 @stop
diff --git a/resources/views/components/nav.blade.php b/resources/views/components/nav.blade.php
index 3cb2154..1d99c31 100644
--- a/resources/views/components/nav.blade.php
+++ b/resources/views/components/nav.blade.php
@@ -6,7 +6,7 @@
         </a>
     </div>
     <div>
-        <a href="{{route('AdCampaignController@index')}}">
+        <a href="{{action('AdCampaignController@index')}}">
             <img src="{{asset('img/nav/2-lacom.svg')}}" alt="Pill Icon">
             <p>Campagnes<br>&<br>Com&shy;munication</p>
         </a>
@@ -27,7 +27,7 @@
     </div>
 
     <div>
-        <a href="#">
+        <a href="{{action('PodcastController@index')}}">
             <img src="{{asset('img/nav/5-onair.svg')}}" alt="Pill Icon">
             <p>Podcast de la com&shy;munication santé</p>
         </a>
@@ -44,20 +44,26 @@
 
     @guest
         <div>
-            <img src="{{asset('img/nav/7-pasabonne.svg')}}" alt="Pill Icon">
-            <a class="" href="{{ route('login') }}">{{ __('Login') }}</a>
+            <a class="" href="{{ route('login') }}">
+                <img src="{{asset('img/nav/7-pasabonne.svg')}}" alt="Pill Icon">
+                <p>
+                    {{ __('Login') }}
+                </p>
+            </a>
         </div>
 
 
     @else
         <div>
-            <img src="{{asset('img/nav/7-pasabonne.svg')}}" alt="Pill Icon">
-
             <a class="" href="{{ route('logout') }}"
                onclick="event.preventDefault();
                                          document.getElementById('logout-form').submit();">
-                {{ __('Logout') }}
+                <img src="{{asset('img/nav/7-pasabonne.svg')}}" alt="Pill Icon">
+                <p>
+                    {{ __('Logout') }}
+                </p>
             </a>
+
             <form id="logout-form" action="{{ route('logout') }}" method="POST" style="display: none;">
                 @csrf
             </form>
diff --git a/resources/views/components/pill-box.blade.php b/resources/views/components/pill-box.blade.php
index d05a3bc..5c5c797 100644
--- a/resources/views/components/pill-box.blade.php
+++ b/resources/views/components/pill-box.blade.php
@@ -1,7 +1,7 @@
-<div {{$attributes->merge(['class' => 'pill-box'])}}>
+<div {{$attributes->merge(['class' => "pill-box"])}}>
 
-    <img src="{{asset('img/red-pill.svg')}}" alt="Pill Icon" class="pill-icon">
-    <div>
+    <img src="{{asset('img/blue-pill-box.svg')}}" alt="Pill Icon" class="pill-icon">
+    <div class="{{$class}}">
         <h2 class="bold">{{$title}}</h2>
         <p>{{$slot}}</p>
         <a href="{{$link}}">Cliquez-ici</a>
diff --git a/resources/views/home/blocks/1_last_editions.blade.php b/resources/views/home/blocks/1_last_editions.blade.php
deleted file mode 100644
index 8816a2c..0000000
--- a/resources/views/home/blocks/1_last_editions.blade.php
+++ /dev/null
@@ -1,18 +0,0 @@
-<h4>
-    Votre Actualité dans les éditions de Prescription Santé Quotidien
-</h4>
-<div class="card-container row">
-
-    @foreach($last_pdf->sortBy('id') as $file)
-        <div class="col-md-3 col-6 px-1 mb-3">
-            <a href="{{$file->getUrl()}}">
-                <cover width="100%" data-image="{{$file->coverUrl}}">
-                    <h1 slot="header">{{$file->ref}}</h1>
-                    <p slot="content">Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
-                </cover>
-            </a>
-        </div>
-
-    @endforeach
-
-</div>
diff --git a/resources/views/home/blocks/1_news.blade.php b/resources/views/home/blocks/1_news.blade.php
deleted file mode 100644
index 24c9102..0000000
--- a/resources/views/home/blocks/1_news.blade.php
+++ /dev/null
@@ -1,7 +0,0 @@
-<h4>Infos du jour</h4>
-
-<ul>
-@foreach($last_pdf->first()->headlines ?? [] as $headline)
-    <li>{{$headline}}</li>
-@endforeach
-</ul>
diff --git a/resources/views/home/blocks/2_ad_campaigns.blade.php b/resources/views/home/blocks/2_ad_campaigns.blade.php
deleted file mode 100644
index 559f363..0000000
--- a/resources/views/home/blocks/2_ad_campaigns.blade.php
+++ /dev/null
@@ -1,3 +0,0 @@
-<div class="row">
-
-</div>
diff --git a/resources/views/home/blocks/3_events.blade.php b/resources/views/home/blocks/3_events.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/4_news.blade.php b/resources/views/home/blocks/4_news.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/5_archives.blade.php b/resources/views/home/blocks/5_archives.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/6_jobs.blade.php b/resources/views/home/blocks/6_jobs.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/7_podcasts.blade.php b/resources/views/home/blocks/7_podcasts.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/A_intro.blade.php b/resources/views/home/blocks/A_intro.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/B_discover.blade.php b/resources/views/home/blocks/B_discover.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/C_subscribe.blade.php b/resources/views/home/blocks/C_subscribe.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/blocks/D_contact.blade.php b/resources/views/home/blocks/D_contact.blade.php
deleted file mode 100644
index e69de29..0000000
diff --git a/resources/views/home/index.blade.php b/resources/views/home/index.blade.php
index 57a44d9..12e13a8 100644
--- a/resources/views/home/index.blade.php
+++ b/resources/views/home/index.blade.php
@@ -7,7 +7,7 @@
     <div class="row justify-content-center pt-3">
         <div class="col-md-4">
             <ul class="leaders">
-                <li><span>à la une aujourd'hui</span></li>
+                <li><span>à la une aujourd'hui</span><span></span></li>
             </ul>
 
             <x-cover :pdf="$last_pdf->first()" type="3">
@@ -25,7 +25,7 @@
 
         <div class="col-md-8">
             <ul class="leaders">
-                <li><span>Nos précédentes éditions</span></li>
+                <li><span>Nos précédentes éditions</span><span></span></li>
             </ul>
 
             <div class="row mb-3">
@@ -38,7 +38,7 @@
                 @endforeach
             </div>
 
-            <x-pill-box title="Consultez ici notre page agenda">
+            <x-pill-box class="my-5" title="Consultez ici notre page agenda">
                 À ne pas manquer aujourd’hui sur la page agenda, le rendez-vous des acteurs de la santé
 et du médicament
 
diff --git a/resources/views/podcasts/index.blade.php b/resources/views/podcasts/index.blade.php
new file mode 100644
index 0000000..a5a036c
--- /dev/null
+++ b/resources/views/podcasts/index.blade.php
@@ -0,0 +1,36 @@
+@extends('layouts.app')
+
+@section('content')
+<div class="container">
+    <h1 class="highlight-cyan">LA SEULE ÉMISSION « ON AIR » DÉDIÉE À LA COMMUNICATION DES ACTEURS DE LA SANTÉ</h1>
+
+
+    <div class="row mt-5">
+        <div class="col-sm-3">
+            <img src="{{asset('img/podcasts/microphone-temporary.png')}}" alt="Image microhpone" class="w-100">
+            <a href="#">Cliquez ici pour écouter l'émission</a>
+        </div>
+        <div class="col-sm-6">
+            {{$podcast->description}}
+        </div>
+        <div class="col-sm-3">
+            <div class="row">
+                @foreach($podcast->guests as $guest)
+                    <div class="col-6">
+                        <img src="{!! $guest->image('profile') !!}" alt="" class="w-100">
+                        <h2>{{$guest->name}}</h2>
+                        <h3>{{$guest->job}}</h3>
+
+
+                    </div>
+                @endforeach
+            </div>
+
+        </div>
+    </div>
+
+
+
+
+</div>
+@endsection
diff --git a/routes/admin.php b/routes/admin.php
index 660c632..f8df3d2 100644
--- a/routes/admin.php
+++ b/routes/admin.php
@@ -7,6 +7,7 @@ Route::group(['prefix' => 'content'], function() {
     Route::module('adCampaigns');
     Route::module('events');
     Route::module('podcasts');
+    Route::module('guests');
 });
 
 
diff --git a/routes/web.php b/routes/web.php
index fb28003..86fdcb1 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -54,6 +54,8 @@ Route::domain(env('CLIENT_DOMAIN_NAME'))->group(function() {
     Route::get('/campaigns', 'AdCampaignController@index');
     Route::get('/campaigns/search', 'AdCampaignController@search');
 
+    Route::get('/podcasts', 'PodcastController@index');
+
     /** Metadata */
     Route::prefix('/files/{file:slug}')->group(function () {
         Route::get('/cover', 'FileController@cover');