diff --git a/app/Http/Controllers/SeedBoxesController.php b/app/Http/Controllers/SeedBoxesController.php
index ed5bfe0..5a4ad2d 100644
--- a/app/Http/Controllers/SeedBoxesController.php
+++ b/app/Http/Controllers/SeedBoxesController.php
@@ -17,8 +17,7 @@ class SeedBoxesController extends Controller
 {
     public function index()
     {
-        $seedboxes = SeedBoxes::seedBoxesDataIndexPage();
-
+        $seedboxes = SeedBoxes::allSeedboxes();
         return view('seedboxes.index', compact(['seedboxes']));
     }
 
@@ -48,13 +47,10 @@ class SeedBoxesController extends Controller
         $seedbox_id = Str::random(8);
 
         $pricing = new Pricing();
-
         $as_usd = $pricing->convertToUSD($request->price, $request->currency);
-
         $pricing->insertPricing(6, $seedbox_id, $request->currency, $request->price, $request->payment_term, $as_usd, $request->next_due_date);
 
         Labels::deleteLabelsAssignedTo($seedbox_id);
-
         Labels::insertLabelsAssigned([$request->label1, $request->label2, $request->label3, $request->label4], $seedbox_id);
 
         SeedBoxes::create([
@@ -73,6 +69,7 @@ class SeedBoxesController extends Controller
             'was_promo' => $request->was_promo
         ]);
 
+        Cache::forget("all_seedboxes");
         Home::homePageCacheForget();
 
         return redirect()->route('seedboxes.index')
@@ -82,20 +79,14 @@ class SeedBoxesController extends Controller
 
     public function show(SeedBoxes $seedbox)
     {
-        $seedbox_extras = SeedBoxes::seedBoxDataShowPage($seedbox->id);
-
-        $labels = Labels::labelsForService($seedbox->id);
-
-        return view('seedboxes.show', compact(['seedbox', 'seedbox_extras', 'labels']));
+        $seedbox_data = SeedBoxes::seedbox($seedbox->id)[0];
+        return view('seedboxes.show', compact(['seedbox_data']));
     }
 
     public function edit(SeedBoxes $seedbox)
     {
-        $seedbox = SeedBoxes::seedBoxEditDataPage($seedbox->id);
-
-        $labels = Labels::labelsForService($seedbox[0]->id);
-
-        return view('seedboxes.edit', compact(['seedbox', 'labels']));
+        $seedbox_data = SeedBoxes::seedbox($seedbox->id)[0];
+        return view('seedboxes.edit', compact(['seedbox_data']));
     }
 
     public function update(Request $request, SeedBoxes $seedbox)
@@ -134,17 +125,15 @@ class SeedBoxesController extends Controller
             ]);
 
         $pricing = new Pricing();
-
         $as_usd = $pricing->convertToUSD($request->price, $request->currency);
-
         $pricing->updatePricing($seedbox->id, $request->currency, $request->price, $request->payment_term, $as_usd, $request->next_due_date);
 
         Labels::deleteLabelsAssignedTo($seedbox->id);
-
         Labels::insertLabelsAssigned([$request->label1, $request->label2, $request->label3, $request->label4], $seedbox->id);
 
+        Cache::forget("all_seedboxes");
+        Cache::forget("seedbox.{$seedbox->id}");
         Cache::forget("labels_for_service.{$seedbox->id}");
-
         Home::homePageCacheForget();
 
         return redirect()->route('seedboxes.index')
@@ -162,6 +151,8 @@ class SeedBoxesController extends Controller
 
         Labels::deleteLabelsAssignedTo($seedbox_id);
 
+        Cache::forget("all_seedboxes");
+        Cache::forget("seedbox.{$seedbox->id}");
         Home::homePageCacheForget();
 
         return redirect()->route('seedboxes.index')
diff --git a/app/Models/SeedBoxes.php b/app/Models/SeedBoxes.php
index 4582881..3b82126 100644
--- a/app/Models/SeedBoxes.php
+++ b/app/Models/SeedBoxes.php
@@ -17,34 +17,39 @@ class SeedBoxes extends Model
 
     protected $fillable = ['id', 'active', 'title', 'hostname', 'seed_box_type', 'provider_id', 'location_id', 'bandwidth', 'port_speed', 'disk', 'disk_type', 'disk_as_gb', 'was_promo', 'owned_since'];
 
-    public static function seedBoxesDataIndexPage()
-    {
-        return DB::table('seedboxes as s')
-            ->join('providers as p', 's.provider_id', '=', 'p.id')
-            ->join('locations as l', 's.location_id', '=', 'l.id')
-            ->join('pricings as pr', 's.id', '=', 'pr.service_id')
-            ->get(['s.*', 'p.name as provider_name', 'pr.*', 'l.name as location']);
+    public static function allSeedboxes()
+    {//All seedboxes and relationships (no using joins)
+        return Cache::remember("all_seedboxes", now()->addMonth(1), function () {
+            return SeedBoxes::with(['location', 'provider', 'price', 'labels.label'])->get();
+        });
     }
 
-    public static function seedBoxDataShowPage(string $seed_box_id)
-    {
-        return DB::table('seedboxes as s')
-            ->join('pricings as pr', 's.id', '=', 'pr.service_id')
-            ->join('providers as p', 's.provider_id', '=', 'p.id')
-            ->join('locations as l', 's.location_id', '=', 'l.id')
-            ->where('s.id', '=', $seed_box_id)
-            ->get(['s.*', 'p.name as provider_name', 'l.name as location', 'pr.*']);
+    public static function seedbox(string $seedbox_id)
+    {//Single seedbox and relationships (no using joins)
+        return Cache::remember("seedbox.$seedbox_id", now()->addMonth(1), function () use ($seedbox_id) {
+            return SeedBoxes::where('id', $seedbox_id)
+                ->with(['location', 'provider', 'price', 'labels.label'])->get();
+        });
     }
 
-    public static function seedBoxEditDataPage(string $seed_box_id)
+    public function location()
     {
-        return DB::table('seedboxes as s')
-            ->join('pricings as pr', 's.id', '=', 'pr.service_id')
-            ->join('providers as p', 's.provider_id', '=', 'p.id')
-            ->join('locations as l', 's.location_id', '=', 'l.id')
-            ->where('s.id', '=', $seed_box_id)
-            ->get(['s.*', 'p.name as provider_name', 'l.name as location', 'pr.*']);
+        return $this->hasOne(Locations::class, 'id', 'location_id');
     }
 
+    public function provider()
+    {
+        return $this->hasOne(Providers::class, 'id', 'provider_id');
+    }
+
+    public function price()
+    {
+        return $this->hasOne(Pricing::class, 'service_id', 'id');
+    }
+
+    public function labels()
+    {
+        return $this->hasMany(LabelsAssigned::class, 'service_id', 'id');
+    }
 
 }
diff --git a/resources/views/seedboxes/edit.blade.php b/resources/views/seedboxes/edit.blade.php
index e846120..737c7bd 100644
--- a/resources/views/seedboxes/edit.blade.php
+++ b/resources/views/seedboxes/edit.blade.php
@@ -1,7 +1,7 @@
-@section('title') {{$seedbox[0]->title}} {{'edit'}} @endsection
+@section('title') {{$seedbox_data->title}} {{'edit'}} @endsection
 <x-app-layout>
     <x-slot name="header">
-        Edit {{ $seedbox[0]->title }}
+        Edit {{ $seedbox_data->title }}
     </x-slot>
     <div class="container">
         <div class="card mt-3 shadow">
@@ -11,7 +11,7 @@
                     Back to seed boxes
                 </a>
                 <x-auth-validation-errors></x-auth-validation-errors>
-                <form action="{{ route('seedboxes.update', $seedbox[0]->service_id) }}" method="POST">
+                <form action="{{ route('seedboxes.update', $seedbox_data->id) }}" method="POST">
                     @csrf
                     @method('PUT')
                     <div class="row mt-3">
@@ -20,7 +20,7 @@
                                 <div class="input-group-prepend"><span class="input-group-text">Title</span></div>
                                 <input type="text"
                                        class="form-control"
-                                       name="title" value="{{$seedbox[0]->title}}">
+                                       name="title" value="{{$seedbox_data->title}}">
                                 @error('title') <span class="text-red-500">{{ $message }}
                     </span>@enderror
                             </div>
@@ -30,44 +30,44 @@
                                 <div class="input-group-prepend"><span class="input-group-text">Hostname</span></div>
                                 <input type="text"
                                        class="form-control"
-                                       name="hostname" value="{{$seedbox[0]->hostname}}">
+                                       name="hostname" value="{{$seedbox_data->hostname}}">
                             </div>
                         </div>
                         <div class="col-12 col-lg-4 mb-4">
-                            <input type="hidden" name="id" value="{{$seedbox[0]->service_id}}">
+                            <input type="hidden" name="id" value="{{$seedbox_data->id}}">
                             <div class="input-group">
                                 <div class="input-group-prepend"><span class="input-group-text">Type</span></div>
                                 <select class="form-control" name="seed_box_type">
                                     <option
-                                        value="uTorrent" {{ ($seedbox[0]->seed_box_type === 'uTorrent') ? 'selected' : '' }}>
+                                        value="uTorrent" {{ ($seedbox_data->seed_box_type === 'uTorrent') ? 'selected' : '' }}>
                                         uTorrent
                                     </option>
                                     <option
-                                        value="BitTorrent" {{ ($seedbox[0]->seed_box_type === 'BitTorrent') ? 'selected' : '' }}>
+                                        value="BitTorrent" {{ ($seedbox_data->seed_box_type === 'BitTorrent') ? 'selected' : '' }}>
                                         BitTorrent
                                     </option>
                                     <option
-                                        value="ruTorrent" {{ ($seedbox[0]->seed_box_type === 'ruTorrent') ? 'selected' : '' }}>
+                                        value="ruTorrent" {{ ($seedbox_data->seed_box_type === 'ruTorrent') ? 'selected' : '' }}>
                                         ruTorrent
                                     </option>
                                     <option
-                                        value="Transmission" {{ ($seedbox[0]->seed_box_type === 'Transmission') ? 'selected' : '' }}>
+                                        value="Transmission" {{ ($seedbox_data->seed_box_type === 'Transmission') ? 'selected' : '' }}>
                                         Transmission
                                     </option>
                                     <option
-                                        value="qBitTorrent" {{ ($seedbox[0]->seed_box_type === 'qBitTorrent') ? 'selected' : '' }}>
+                                        value="qBitTorrent" {{ ($seedbox_data->seed_box_type === 'qBitTorrent') ? 'selected' : '' }}>
                                         qBitTorrent
                                     </option>
                                     <option
-                                        value="Zona" {{ ($seedbox[0]->seed_box_type === 'Zona') ? 'selected' : '' }}>
+                                        value="Zona" {{ ($seedbox_data->seed_box_type === 'Zona') ? 'selected' : '' }}>
                                         Zona
                                     </option>
                                     <option
-                                        value="Other" {{ ($seedbox[0]->seed_box_type === 'Other') ? 'selected' : '' }}>
+                                        value="Other" {{ ($seedbox_data->seed_box_type === 'Other') ? 'selected' : '' }}>
                                         Other
                                     </option>
                                     <option
-                                        value="Deluge" {{ ($seedbox[0]->seed_box_type === 'Deluge') ? 'selected' : '' }}>
+                                        value="Deluge" {{ ($seedbox_data->seed_box_type === 'Deluge') ? 'selected' : '' }}>
                                         Deluge
                                     </option>
                                 </select>
@@ -77,14 +77,14 @@
                     <div class="row">
                         <div class="col-md-3 mb-3">
                             <x-providers-select>
-                                <x-slot name="current">{{$seedbox[0]->provider_id}}</x-slot>
+                                <x-slot name="current">{{$seedbox_data->provider->id}}</x-slot>
                             </x-providers-select>
                         </div>
                         <div class="col-md-3 mb-3">
                             <x-number-input>
                                 <x-slot name="title">Price</x-slot>
                                 <x-slot name="name">price</x-slot>
-                                <x-slot name="value">{{$seedbox[0]->price}}</x-slot>
+                                <x-slot name="value">{{$seedbox_data->price->price}}</x-slot>
                                 <x-slot name="max">9999</x-slot>
                                 <x-slot name="step">0.01</x-slot>
                                 <x-slot name="required"></x-slot>
@@ -92,40 +92,40 @@
                         </div>
                         <div class="col-md-3 mb-3">
                             <x-term-select>
-                                <x-slot name="current">{{$seedbox[0]->term}}</x-slot>
+                                <x-slot name="current">{{$seedbox_data->price->term}}</x-slot>
                             </x-term-select>
                         </div>
                         <div class="col-md-3 mb-3">
                             <x-currency-select>
-                                <x-slot name="current">{{$seedbox[0]->currency}}</x-slot>
+                                <x-slot name="current">{{$seedbox_data->price->currency}}</x-slot>
                             </x-currency-select>
                         </div>
                     </div>
                     <div class="row mb-2">
                         <div class="col-12 col-md-3 mb-3">
                             <x-locations-select>
-                                <x-slot name="current">{{$seedbox[0]->location_id}}</x-slot>
+                                <x-slot name="current">{{$seedbox_data->location_id}}</x-slot>
                             </x-locations-select>
                         </div>
                         <div class="col-12 col-md-3 mb-3">
                             <x-yes-no-select>
                                 <x-slot name="title">Promo price</x-slot>
                                 <x-slot name="name">was_promo</x-slot>
-                                <x-slot name="value">{{ $seedbox[0]->was_promo }}</x-slot>
+                                <x-slot name="value">{{ $seedbox_data->was_promo }}</x-slot>
                             </x-yes-no-select>
                         </div>
                         <div class="col-12 col-md-3 mb-3">
                             <x-date-input>
                                 <x-slot name="title">Owned since</x-slot>
                                 <x-slot name="name">owned_since</x-slot>
-                                <x-slot name="value">{{$seedbox[0]->owned_since }}</x-slot>
+                                <x-slot name="value">{{$seedbox_data->owned_since }}</x-slot>
                             </x-date-input>
                         </div>
                         <div class="col-12 col-md-3 mb-3">
                             <x-date-input>
                                 <x-slot name="title">Next due date</x-slot>
                                 <x-slot name="name">next_due_date</x-slot>
-                                <x-slot name="value">{{$seedbox[0]->next_due_date }}</x-slot>
+                                <x-slot name="value">{{$seedbox_data->price->next_due_date }}</x-slot>
                             </x-date-input>
                         </div>
                     </div>
@@ -137,7 +137,7 @@
                                 <x-slot name="value">1</x-slot>
                                 <x-slot name="max">999999</x-slot>
                                 <x-slot name="step">1</x-slot>
-                                <x-slot name="value">{{$seedbox[0]->disk_as_gb}}</x-slot>
+                                <x-slot name="value">{{$seedbox_data->disk_as_gb}}</x-slot>
                             </x-number-input>
                         </div>
                         <div class="col-12 col-lg-3 mb-4">
@@ -147,7 +147,7 @@
                                 <x-slot name="value">1</x-slot>
                                 <x-slot name="max">999999</x-slot>
                                 <x-slot name="step">1</x-slot>
-                                <x-slot name="value">{{$seedbox[0]->bandwidth}}</x-slot>
+                                <x-slot name="value">{{$seedbox_data->bandwidth}}</x-slot>
                             </x-number-input>
                         </div>
                         <div class="col-12 col-lg-3 mb-4">
@@ -157,7 +157,7 @@
                                 <x-slot name="value">1</x-slot>
                                 <x-slot name="max">999999</x-slot>
                                 <x-slot name="step">1</x-slot>
-                                <x-slot name="value">{{$seedbox[0]->port_speed}}</x-slot>
+                                <x-slot name="value">{{$seedbox_data->port_speed}}</x-slot>
                             </x-number-input>
                         </div>
                     </div>
@@ -166,8 +166,8 @@
                             <x-labels-select>
                                 <x-slot name="title">label</x-slot>
                                 <x-slot name="name">label1</x-slot>
-                                @if(isset($labels[0]->id))
-                                    <x-slot name="current">{{$labels[0]->id}}</x-slot>
+                                @if(isset($seedbox_data->labels[0]->label->id))
+                                    <x-slot name="current">{{$seedbox_data->labels[0]->label->id}}</x-slot>
                                 @endif
                             </x-labels-select>
                         </div>
@@ -175,8 +175,8 @@
                             <x-labels-select>
                                 <x-slot name="title">label</x-slot>
                                 <x-slot name="name">label2</x-slot>
-                                @if(isset($labels[1]->id))
-                                    <x-slot name="current">{{$labels[1]->id}}</x-slot>
+                                @if(isset($seedbox_data->labels[1]->label->id))
+                                    <x-slot name="current">{{$seedbox_data->labels[1]->label->id}}</x-slot>
                                 @endif
                             </x-labels-select>
                         </div>
@@ -184,8 +184,8 @@
                             <x-labels-select>
                                 <x-slot name="title">label</x-slot>
                                 <x-slot name="name">label3</x-slot>
-                                @if(isset($labels[2]->id))
-                                    <x-slot name="current">{{$labels[2]->id}}</x-slot>
+                                @if(isset($seedbox_data->labels[2]->label->id))
+                                    <x-slot name="current">{{$seedbox_data->labels[2]->label->id}}</x-slot>
                                 @endif
                             </x-labels-select>
                         </div>
@@ -193,15 +193,15 @@
                             <x-labels-select>
                                 <x-slot name="title">label</x-slot>
                                 <x-slot name="name">label4</x-slot>
-                                @if(isset($labels[3]->id))
-                                    <x-slot name="current">{{$labels[3]->id}}</x-slot>
+                                @if(isset($seedbox_data->labels[3]->label->id))
+                                    <x-slot name="current">{{$seedbox_data->labels[3]->label->id}}</x-slot>
                                 @endif
                             </x-labels-select>
                         </div>
                     </div>
                     <div class="form-check mt-2">
                         <input class="form-check-input" name="is_active" type="checkbox"
-                               value="1" {{ ($seedbox[0]->active === 1) ? 'checked' : '' }}>
+                               value="1" {{ ($seedbox_data->active === 1) ? 'checked' : '' }}>
                         <label class="form-check-label">
                             I still have this server
                         </label>
diff --git a/resources/views/seedboxes/index.blade.php b/resources/views/seedboxes/index.blade.php
index 4e07d1b..aa1afd5 100644
--- a/resources/views/seedboxes/index.blade.php
+++ b/resources/views/seedboxes/index.blade.php
@@ -43,8 +43,8 @@
                                 <tr>
                                     <td>{{ $row->title }}</td>
                                     <td>{{ $row->seed_box_type }}</td>
-                                    <td class="text-nowrap">{{ $row->location }}</td>
-                                    <td class="text-nowrap">{{ $row->provider_name }}</td>
+                                    <td class="text-nowrap">{{ $row->location->name }}</td>
+                                    <td class="text-nowrap">{{ $row->provider->name }}</td>
                                     <td>
                                         @if($row->disk_as_gb >= 1000)
                                             {{ number_format($row->disk_as_gb / 1000,1) }} <small>TB</small>
@@ -66,22 +66,22 @@
                                             {{ $row->port_speed }} <small>Mbps</small>
                                         @endif
                                     </td>
-                                    <td>{{ $row->price }} {{$row->currency}} {{\App\Process::paymentTermIntToString($row->term)}}</td>
-                                    <td>{{Carbon\Carbon::parse($row->next_due_date)->diffForHumans()}}</td>
+                                    <td>{{ $row->price->price }} {{$row->price->currency}} {{\App\Process::paymentTermIntToString($row->price->term)}}</td>
+                                    <td>{{Carbon\Carbon::parse($row->price->next_due_date)->diffForHumans()}}</td>
                                     <td class="text-nowrap">{{ $row->owned_since }}</td>
                                     <td class="text-nowrap">
-                                        <form action="{{ route('seedboxes.destroy', $row->service_id) }}" method="POST">
+                                        <form action="{{ route('seedboxes.destroy', $row->id) }}" method="POST">
                                             @csrf
-                                            <a href="{{ route('seedboxes.show', $row->service_id) }}"
+                                            <a href="{{ route('seedboxes.show', $row->id) }}"
                                                class="text-body mx-1">
                                                 <i class="fas fa-eye" title="view"></i>
                                             </a>
-                                            <a href="{{ route('seedboxes.edit', $row->service_id) }}"
+                                            <a href="{{ route('seedboxes.edit', $row->id) }}"
                                                class="text-body mx-1">
                                                 <i class="fas fa-pen" title="edit"></i>
                                             </a>
                                             <i class="fas fa-trash text-danger ms-3" @click="modalForm"
-                                               id="btn-{{$row->title}}" title="{{$row->service_id}}"></i>
+                                               id="btn-{{$row->title}}" title="{{$row->id}}"></i>
                                         </form>
                                     </td>
                                 </tr>
diff --git a/resources/views/seedboxes/show.blade.php b/resources/views/seedboxes/show.blade.php
index b52f480..579a95d 100644
--- a/resources/views/seedboxes/show.blade.php
+++ b/resources/views/seedboxes/show.blade.php
@@ -1,4 +1,4 @@
-@section('title') {{$seedbox->title}} {{'Seed box'}} @endsection
+@section('title') {{$seedbox_data->title}} {{'Seed box'}} @endsection
 <x-app-layout>
     <x-slot name="header">
         {{ __('Seed box details') }}
@@ -7,18 +7,14 @@
         <x-card class="shadow mt-3">
             <div class="row">
                 <div class="col-12 col-md-6 mb-2">
-                    <h2>{{ $seedbox->title }}</h2>
-                    <code>@foreach($labels as $label)
-                            @if($loop->last)
-                                {{$label->label}}
-                            @else
-                                {{$label->label}},
-                            @endif
-                        @endforeach</code>
+                    <h2>{{ $seedbox_data->title }}</h2>
+                    @foreach($seedbox_data->labels as $label)
+                        <span class="badge bg-primary mx-1">{{$label->label->label}}</span>
+                    @endforeach
                 </div>
                 <div class="col-12 col-md-6 text-md-end">
-                    <h6 class="text-muted pe-lg-4">{{ $seedbox->id }}</h6>
-                    @if($seedbox->active !== 1)
+                    <h6 class="text-muted pe-lg-4">{{ $seedbox_data->id }}</h6>
+                    @if($seedbox_data->active !== 1)
                         <h6 class="text-danger pe-lg-4">not active</h6>
                     @endif
                 </div>
@@ -30,57 +26,57 @@
                             <tbody>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Type</td>
-                                <td>{{ $seedbox->seed_box_type }}</td>
+                                <td>{{ $seedbox_data->seed_box_type }}</td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Hostname</td>
-                                <td><code>{{ $seedbox_extras[0]->hostname }}</code></td>
+                                <td><code>{{ $seedbox_data->hostname }}</code></td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Location</td>
-                                <td>{{ $seedbox_extras[0]->location }}</td>
+                                <td>{{ $seedbox_data->location->name }}</td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Provider</td>
-                                <td>{{ $seedbox_extras[0]->provider_name }}</td>
+                                <td>{{ $seedbox_data->provider->name }}</td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Price</td>
-                                <td>{{ $seedbox_extras[0]->price }} {{ $seedbox_extras[0]->currency }}
-                                    <small>{{\App\Process::paymentTermIntToString($seedbox_extras[0]->term)}}</small>
+                                <td>{{ $seedbox_data->price->price }} {{ $seedbox_data->price->currency }}
+                                    <small>{{\App\Process::paymentTermIntToString($seedbox_data->price->term)}}</small>
                                 </td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Was promo</td>
-                                <td>{{ ($seedbox_extras[0]->was_promo === 1) ? 'Yes' : 'No' }}</td>
+                                <td>{{ ($seedbox_data->was_promo === 1) ? 'Yes' : 'No' }}</td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Owned since</td>
                                 <td>
-                                    @if(!is_null($seedbox->owned_since))
-                                        {{ date_format(new DateTime($seedbox->owned_since), 'jS F Y') }}
+                                    @if(!is_null($seedbox_data->owned_since))
+                                        {{ date_format(new DateTime($seedbox_data->owned_since), 'jS F Y') }}
                                     @endif
                                 </td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Next due date</td>
-                                <td>{{Carbon\Carbon::parse($seedbox_extras[0]->next_due_date)->diffForHumans()}}
-                                    ({{Carbon\Carbon::parse($seedbox_extras[0]->next_due_date)->format('d/m/Y')}})
+                                <td>{{Carbon\Carbon::parse($seedbox_data->price->next_due_date)->diffForHumans()}}
+                                    ({{Carbon\Carbon::parse($seedbox_data->price->next_due_date)->format('d/m/Y')}})
                                 </td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Inserted</td>
                                 <td>
-                                    @if(!is_null($seedbox->created_at))
-                                        {{ date_format(new DateTime($seedbox->created_at), 'jS M y g:i a') }}
+                                    @if(!is_null($seedbox_data->created_at))
+                                        {{ date_format(new DateTime($seedbox_data->created_at), 'jS M y g:i a') }}
                                     @endif
                                 </td>
                             </tr>
                             <tr>
                                 <td class="px-2 py-2 font-bold text-muted">Updated</td>
                                 <td>
-                                    @if(!is_null($seedbox->updated_at))
-                                        {{ date_format(new DateTime($seedbox->updated_at), 'jS M y g:i a') }}
+                                    @if(!is_null($seedbox_data->updated_at))
+                                        {{ date_format(new DateTime($seedbox_data->updated_at), 'jS M y g:i a') }}
                                     @endif
                                 </td>
                             </tr>
@@ -94,30 +90,30 @@
                         <tr>
                             <td class="px-2 py-2 font-bold text-muted">Disk</td>
                             <td>
-                                @if($seedbox->disk_as_gb >= 1000)
-                                    {{ number_format($seedbox->disk_as_gb / 1000,1) }} <small>TB</small>
+                                @if($seedbox_data->disk_as_gb >= 1000)
+                                    {{ number_format($seedbox_data->disk_as_gb / 1000,1) }} <small>TB</small>
                                 @else
-                                    {{ $seedbox->disk_as_gb }} <small>GB</small>
+                                    {{ $seedbox_data->disk_as_gb }} <small>GB</small>
                                 @endif
                             </td>
                         </tr>
                         <tr>
                             <td class="px-2 py-2 font-bold text-muted">Bandwidth</td>
                             <td>
-                                @if($seedbox->bandwidth >= 1000)
-                                    {{ number_format($seedbox->bandwidth / 1000,1) }} <small>TB</small>
+                                @if($seedbox_data->bandwidth >= 1000)
+                                    {{ number_format($seedbox_data->bandwidth / 1000,1) }} <small>TB</small>
                                 @else
-                                    {{ $seedbox->bandwidth }} <small>GB</small>
+                                    {{ $seedbox_data->bandwidth }} <small>GB</small>
                                 @endif
                             </td>
                         </tr>
                         <tr>
                             <td class="px-2 py-2 font-bold text-muted">Port speed</td>
                             <td>
-                                @if($seedbox->port_speed >= 1000)
-                                    {{ number_format($seedbox->port_speed / 1000,1) }} <small>Gbps</small>
+                                @if($seedbox_data->port_speed >= 1000)
+                                    {{ number_format($seedbox_data->port_speed / 1000,1) }} <small>Gbps</small>
                                 @else
-                                    {{ $seedbox->port_speed }} <small>Mbps</small>
+                                    {{ $seedbox_data->port_speed }} <small>Mbps</small>
                                 @endif
                             </td>
                         </tr>
@@ -126,14 +122,12 @@
 
                 </div>
             </div>
-            <a href="{{ route('seedboxes.index') }}"
-               class="btn btn-success btn-sm mx-2">
-                Go back
-            </a>
-            <a href="{{ route('seedboxes.edit', $seedbox->id) }}"
-               class="btn btn-primary btn-sm mx-2">
-                Edit
-            </a>
+            <x-back-btn>
+                <x-slot name="route">{{ route('seedboxes.index') }}</x-slot>
+            </x-back-btn>
+            <x-edit-btn>
+                <x-slot name="route">{{ route('seedboxes.edit', $seedbox_data->id) }}</x-slot>
+            </x-edit-btn>
         </x-card>
         @if(Session::has('timer_version_footer') && Session::get('timer_version_footer') === 1)
             <p class="text-muted mt-4 text-end"><small>
diff --git a/resources/views/servers/index-cards.blade.php b/resources/views/servers/index-cards.blade.php
new file mode 100644
index 0000000..7f5af80
--- /dev/null
+++ b/resources/views/servers/index-cards.blade.php
@@ -0,0 +1,149 @@
+@section('title')
+    {{'Servers'}}
+@endsection
+@section('style')
+    <x-modal-style></x-modal-style>
+@endsection
+@section('scripts')
+    <script src="{{ asset('js/vue.min.js') }}"></script>
+    <script src="{{ asset('js/axios.min.js') }}"></script>
+@endsection
+<x-app-layout>
+    <x-slot name="header">
+        {{ __('Servers') }}
+    </x-slot>
+    <div class="container" id="app">
+        <x-delete-confirm-modal></x-delete-confirm-modal>
+        <ul class="nav nav-tabs mt-3" id="myTab" role="tablist">
+            <li class="nav-item" role="presentation">
+                <button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home" type="button"
+                        role="tab" aria-controls="home" aria-selected="true">Active
+                </button>
+            </li>
+            <li class="nav-item" role="presentation">
+                <button class="nav-link @if(!isset($non_active_servers[0]))disabled @endif" id="profile-tab"
+                        data-bs-toggle="tab" data-bs-target="#non-active" type="button" role="tab"
+                        aria-controls="profile" aria-selected="false">Non active
+                </button>
+            </li>
+        </ul>
+        <div class="tab-content" id="myTabContent">
+            <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
+                <div class="row mt-3">
+                    @if(!empty($servers))
+                        @foreach($servers as $server)
+                            <div class="col-12 col-lg-4 mb-2">
+                                <div class="card rounded h-100" style="overflow-y: scroll">
+                                    <div class="card-body">
+                                        <div class="row">
+                                            <div class="col-12 col-lg-8">
+                                                <h5 class="card-title">{{ $server->hostname }}</h5>
+                                            </div>
+                                            <div class="col-12 col-lg-4 text-end">
+                                                <a href="{{route('servers.edit', $server->id)}}" style="color: #636363;"><i
+                                                        class="fas fa-pen mx-1"></i></a>
+                                                <a href="{{route('servers.show', $server->id)}}" style="color: #636363;"><i
+                                                        class="fas fa-eye mx-1"></i></a>
+                                                <a href="{{route('servers.show', $server->id)}}" style="color: #636363;"><i
+                                                        class="fas fa-trash mx-1"></i></a>
+                                            </div>
+                                        </div>
+                                        <div class="row mt-1">
+                                            <div class="col-12 col-lg-8">
+                                                <h6 class="card-subtitle mb-2 text-muted">{{ $server->location->name }}</h6>
+                                            </div>
+                                            <div class="col-12 col-lg-4 text-lg-end">
+                                                <h6 class="card-subtitle mb-2 text-muted">{{ $server->price->currency }} {{ $server->price->price }}</h6>
+                                            </div>
+                                        </div>
+                                        <div class="row mt-1">
+                                            <div class="col-12 col-md-8">
+                                                <p class="card-text">{{ $server->provider->name }}</p>
+                                            </div>
+                                            <div class="col-12 col-md-4 text-md-end">
+                                                <p class="card-text">{{ $server->os->name }}</p>
+                                            </div>
+                                        </div>
+                                        <div class="row my-1">
+                                            <div class="col-6">
+                                                {{$server->cpu}}
+                                                <i class="fas fa-microchip mx-1" style="color: #0000008c;"></i>
+                                            </div>
+                                            <div class="col-6 text-end">
+                                                {{$server->ram}} {{$server->ram_type}}
+                                                <i class="fas fa-memory mx-1" style="color: #0000008c;"></i>
+                                            </div>
+                                        </div>
+                                        <div class="row my-1">
+                                            <div class="col-6">
+                                                {{$server->disk}} {{$server->disk_type}}
+                                                <i class="fas fa-hdd mx-1" style="color: #0000008c;"></i>
+                                            </div>
+                                            <div class="col-6 text-end">
+                                                @if(isset($server->yabs[0]->cpu_cores))
+                                                    <i class="fas fa-check mx-1" style="color: #0000008c;"></i>YABs
+                                                @else
+                                                    <i class="fas fa-times mx-1" style="color: #0000008c;"></i>YABs
+                                                @endif
+                                            </div>
+                                        </div>
+                                    </div>
+                                </div>
+                            </div>
+                        @endforeach
+                    @endif
+                </div>
+            </div>
+            <div class="tab-pane fade" id="non-active" role="tabpanel" aria-labelledby="non-active-tab">
+
+            </div>
+            @if(Session::has('timer_version_footer') && Session::get('timer_version_footer') === 1)
+                <p class="text-muted mt-4 text-end"><small>Built on Laravel
+                        v{{ Illuminate\Foundation\Application::VERSION }} (PHP v{{ PHP_VERSION }})</small></p>
+            @endif
+        </div>
+
+        <script>
+            axios.defaults.headers.common = {
+                'Content-Type': 'application/json',
+                'X-Requested-With': 'XMLHttpRequest',
+                'X-CSRF-TOKEN': document.querySelector('meta[name="csrf-token"]').getAttribute('content'),
+                'Accept': 'application/json',
+            };
+
+            let app = new Vue({
+                el: "#app",
+                data: {
+                    "status": false,
+                    "modal_hostname": '',
+                    "modal_id": '',
+                    "delete_form_action": '',
+                    showModal: false
+                },
+                methods: {
+                    onClk(event) {
+                        var hostname = event.target.id.replace('btn-', '');
+
+                        if (hostname) {
+                            axios
+                                .get('/api/online/' + event.target.id.replace('btn-', ''), {headers: {'Authorization': 'Bearer ' + document.querySelector('meta[name="api_token"]').getAttribute('content')}})
+                                .then(response => (this.status = response.data.is_online))
+                                .finally(() => {
+                                    if (this.status) {
+                                        event.target.className = "fas fa-plug text-success mx-1";
+                                    } else if (!this.status) {
+                                        event.target.className = "fas fa-plug text-danger mx-1";
+                                    }
+                                });
+                        }
+                    },
+                    modalForm(event) {
+                        this.showModal = true;
+                        this.modal_hostname = event.target.id.replace('btn-', '');
+                        this.modal_id = event.target.title;
+                        this.delete_form_action = 'servers/' + this.modal_id;
+                    }
+                }
+            });
+        </script>
+</x-app-layout>