diff --git a/resources/views/livewire/project/shared/destination.blade.php b/resources/views/livewire/project/shared/destination.blade.php
index 6e494d3e7..013ca5e4f 100644
--- a/resources/views/livewire/project/shared/destination.blade.php
+++ b/resources/views/livewire/project/shared/destination.blade.php
@@ -2,9 +2,10 @@
     <h2>Servers</h2>
     <div class="">Server related configurations.</div>
     <div class="grid grid-cols-1 gap-4 py-4">
-        <div class="flex gap-2">
-            <div class="relative flex flex-col bg-white border cursor-default dark:text-white box-without-bg dark:bg-coolgray-100 w-96 dark:border-black">
-                <div class="text-xl font-bold">Primary Server</div>
+        <div class="flex flex-col gap-2">
+            <h3>Primary Server</h3>
+            <div
+                class="relative flex flex-col bg-white border cursor-default dark:text-white box-without-bg dark:bg-coolgray-100 w-96 dark:border-black">
                 @if (str($resource->realStatus())->startsWith('running'))
                     <div title="{{ $resource->realStatus() }}" class="absolute bg-success -top-1 -left-1 badge ">
                     </div>
@@ -12,26 +13,29 @@
                     <div title="{{ $resource->realStatus() }}" class="absolute bg-error -top-1 -left-1 badge ">
                     </div>
                 @endif
-                <div>
+                <div class="box-title">
                     Server: {{ data_get($resource, 'destination.server.name') }}
                 </div>
-                <div>
+                <div class="box-description">
                     Network: {{ data_get($resource, 'destination.network') }}
                 </div>
             </div>
             @if ($resource?->additional_networks?->count() > 0)
-                <x-forms.button
-                    wire:click="redeploy('{{ data_get($resource, 'destination.id') }}','{{ data_get($resource, 'destination.server.id') }}')">Deploy</x-forms.button>
-                @if (str($resource->realStatus())->startsWith('running'))
-                    <x-forms.button isError
-                        wire:click="stop('{{ data_get($resource, 'destination.server.id') }}')">Stop</x-forms.button>
-                @endif
+                <div>
+                    <x-forms.button
+                        wire:click="redeploy('{{ data_get($resource, 'destination.id') }}','{{ data_get($resource, 'destination.server.id') }}')">Deploy</x-forms.button>
+                    @if (str($resource->realStatus())->startsWith('running'))
+                        <x-forms.button isError
+                            wire:click="stop('{{ data_get($resource, 'destination.server.id') }}')">Stop</x-forms.button>
+                    @endif
+                </div>
             @endif
         </div>
         @if ($resource?->additional_networks?->count() > 0)
+            <h3>Additional Server(s)</h3>
             @foreach ($resource->additional_networks as $destination)
-                <div class="flex gap-2">
-                    <div class="relative flex flex-col box w-96">
+                <div class="flex flex-col gap-2">
+                    <div class="relative flex flex-col w-full box">
                         @if (str(data_get($destination, 'pivot.status'))->startsWith('running'))
                             <div title="{{ data_get($destination, 'pivot.status') }}"
                                 class="absolute bg-success -top-1 -left-1 badge "></div>
@@ -40,28 +44,31 @@ class="absolute bg-success -top-1 -left-1 badge "></div>
                                 class="absolute bg-error -top-1 -left-1 badge "></div>
                         @endif
                         <div>
-                            Server: {{ data_get($destination, 'server.name') }}
-                        </div>
-                        <div>
-                            Network: {{ data_get($destination, 'network') }}
+                            <div class="box-title">
+                                Server: {{ data_get($destination, 'server.name') }}
+                            </div>
+                            <div class="box-description">
+                                Network: {{ data_get($destination, 'network') }}
+                            </div>
                         </div>
                     </div>
-                    <x-forms.button
-                        wire:click="redeploy('{{ data_get($destination, 'id') }}','{{ data_get($destination, 'server.id') }}')">Deploy</x-forms.button>
-                    <x-forms.button
-                        wire:click="promote('{{ data_get($destination, 'id') }}','{{ data_get($destination, 'server.id') }}')">Promote
-                        to Primary </x-forms.button>
-                    @if (data_get_str($destination, 'pivot.status')->startsWith('running'))
-                        <x-forms.button isError
-                            wire:click="stop('{{ data_get($destination, 'server.id') }}')">Stop</x-forms.button>
-                    @endif
-                    <x-modal-confirmation
-                        action="removeServer({{ data_get($destination, 'id') }},{{ data_get($destination, 'server.id') }})"
-                        isErrorButton buttonTitle="Remove Server">
-                        This will stop the running application in this server and remove it as a deployment
-                        destination.<br><br>Please think again.
-                    </x-modal-confirmation>
-
+                    <div class="flex gap-2">
+                        <x-forms.button
+                            wire:click="redeploy('{{ data_get($destination, 'id') }}','{{ data_get($destination, 'server.id') }}')">Deploy</x-forms.button>
+                        <x-forms.button
+                            wire:click="promote('{{ data_get($destination, 'id') }}','{{ data_get($destination, 'server.id') }}')">Promote
+                            to Primary </x-forms.button>
+                        @if (data_get_str($destination, 'pivot.status')->startsWith('running'))
+                            <x-forms.button isError
+                                wire:click="stop('{{ data_get($destination, 'server.id') }}')">Stop</x-forms.button>
+                        @endif
+                        <x-modal-confirmation
+                            action="removeServer({{ data_get($destination, 'id') }},{{ data_get($destination, 'server.id') }})"
+                            isErrorButton buttonTitle="Remove Server">
+                            This will stop the running application in this server and remove it as a deployment
+                            destination.<br><br>Please think again.
+                        </x-modal-confirmation>
+                    </div>
                 </div>
             @endforeach
         @endif
@@ -75,10 +82,12 @@ class="absolute bg-error -top-1 -left-1 badge "></div>
                     <div wire:click="addServer('{{ $network->id }}','{{ data_get($network, 'server.id') }}')"
                         class="relative flex flex-col cursor-default dark:text-white box w-96">
                         <div>
-                            Server: {{ data_get($network, 'server.name') }}
-                        </div>
-                        <div>
-                            Network: {{ data_get($network, 'name') }}
+                            <div class="box-title">
+                                Server: {{ data_get($network, 'server.name') }}
+                            </div>
+                            <div class="box-description">
+                                Network: {{ data_get($network, 'name') }}
+                            </div>
                         </div>
                     </div>
                 @endforeach