diff --git a/resources/assets/vue/components/reports/sections/ServiceReportSectionComponent.vue b/resources/assets/vue/components/reports/sections/ServiceReportSectionComponent.vue
index 0fce086e..a7484136 100644
--- a/resources/assets/vue/components/reports/sections/ServiceReportSectionComponent.vue
+++ b/resources/assets/vue/components/reports/sections/ServiceReportSectionComponent.vue
@@ -4,12 +4,12 @@
             <loading-component v-if="isLoading"></loading-component>
             <div class="row" v-if="report">
                 <div class="col">
-                    <div class="row m-l-0 m-r-0 m-b-25" style="height: 100px;">
+                    <div class="row m-l-0 m-r-0 m-b-25" style="height: 50px;">
                         <div class="col" :style="{'max-width': progressPercentage(pendingPackingPackages)+'%'}">
-                            <div class="row h-75">
+                            <div class="row h-50">
                                 <div class="col bg-success"></div>
                             </div>
-                            <div class="row h-25 align-items-end b-r b-grey">
+                            <div class="row h-50 align-items-end b-r b-grey">
                                 <div class="col"></div>
                                 <div class="col-auto">
                                     <small class="fs-10">{{progressPercentage(pendingPackingPackages)}}%</small>
@@ -17,10 +17,10 @@
                             </div>
                         </div>
                         <div class="col" :style="{'max-width': progressPercentage(report.pending_shipment)+'%'}">
-                            <div class="row h-75">
+                            <div class="row h-50">
                                 <div class="col bg-success-light"></div>
                             </div>
-                            <div class="row h-25 align-items-end b-r b-grey">
+                            <div class="row h-50 align-items-end b-r b-grey">
                                 <div class="col"></div>
                                 <div class="col-auto">
                                     <small class="fs-10">{{progressPercentage(report.pending_shipment)}}%</small>
@@ -28,10 +28,10 @@
                             </div>
                         </div>
                         <div class="col" :style="{'max-width': progressPercentage(report.in_transit)+'%'}">
-                            <div class="row h-75">
+                            <div class="row h-50">
                                 <div class="col bg-warning"></div>
                             </div>
-                            <div class="row h-25 align-items-end b-r b-grey">
+                            <div class="row h-50 align-items-end b-r b-grey">
                                 <div class="col"></div>
                                 <div class="col-auto">
                                     <small class="fs-10">{{progressPercentage(report.in_transit)}}%</small>
@@ -39,10 +39,10 @@
                             </div>
                         </div>
                         <div class="col" :style="{'max-width': progressPercentage(report.pending_delivery)+'%'}">
-                            <div class="row h-75">
+                            <div class="row h-50">
                                 <div class="col bg-danger"></div>
                             </div>
-                            <div class="row h-25 align-items-end b-r b-grey">
+                            <div class="row h-50 align-items-end b-r b-grey">
                                 <div class="col"></div>
                                 <div class="col-auto">
                                     <small class="fs-10">{{progressPercentage(report.pending_delivery)}}%</small>