diff --git a/resources/assets/vue/components/bookings/elements/AvailableVouchersComponent.vue b/resources/assets/vue/components/bookings/elements/AvailableVouchersComponent.vue
index 7c3d5494..4ac885ff 100644
--- a/resources/assets/vue/components/bookings/elements/AvailableVouchersComponent.vue
+++ b/resources/assets/vue/components/bookings/elements/AvailableVouchersComponent.vue
@@ -1,9 +1,9 @@
 <template>
      <div class="row">
         <div class="col">
-            <div class="row text-left no-margin bg-white" v-if="!isLoading" v-for="item in vouchers" v-bind:key="item.id" >
+            <div v-if="vouchers" class="row fs-10 p-b-5">List of Vouchers, click to select</div>
+            <div class="row text-left no-margin bg-white p-b-10" v-if="!isLoading" v-for="item in vouchers" v-bind:key="item.id" >
                 <div id="select-option" name="select-option" class="col b-b b-grey p-t-10 p-b-10 pointer  p-t-10 p-b-10" @click="selectVoucher(item)">
-                    <div class="row fs-10 p-b-5">List of Vouchers, click to select</div>
                     <div class="row">
                         <!-- <div class="col">
                             <p v-if="item.voucher.type == 'AMOUNT'">RM{{ item.voucher.value/100 }} Discount</p>