diff --git a/app/Http/Controllers/EnvironmentController.php b/app/Http/Controllers/EnvironmentController.php
index 388fdf28..3254b546 100755
--- a/app/Http/Controllers/EnvironmentController.php
+++ b/app/Http/Controllers/EnvironmentController.php
@@ -55,13 +55,30 @@ class EnvironmentController extends Controller
      */
     public function saveMailEnvironment(MailEnvironmentRequest $request)
     {
+        $setting = Setting::getSetting('profile_complete');
         $results = $this->EnvironmentManager->saveMailVariables($request);
 
-        Setting::setSetting('profile_complete', 4);
+        if ($setting !== 'COMPLETED')
+        {
+            Setting::setSetting('profile_complete', 4);
+        }
 
         return response()->json($results);
     }
 
+    public function getMailEnvironment()
+    {
+        $MailData = [
+            'mail_driver' => config('mail.driver'),
+            'mail_host' => config('mail.host'),
+            'mail_port' => config('mail.port'),
+            'mail_username' => config('mail.username'),
+            'mail_password' => config('mail.password'),
+            'mail_encryption' => config('mail.encryption')
+        ];
+
+        return response()->json($MailData);
+    }
 
     /**
      *
diff --git a/resources/assets/js/components/base/BaseInput.vue b/resources/assets/js/components/base/BaseInput.vue
index 08a85bfd..09936d55 100644
--- a/resources/assets/js/components/base/BaseInput.vue
+++ b/resources/assets/js/components/base/BaseInput.vue
@@ -4,7 +4,7 @@
     <input
       ref="baseInput"
       v-model="inputValue"
-      :type="type"
+      :type="toggleType"
       :disabled="disabled"
       :readonly="readOnly"
       :name="name"
@@ -19,6 +19,9 @@
       @keydown="handleKeyDownEnter"
       @blur="handleFocusOut"
     >
+    <div v-if="showPassword && isAlignLeftIcon" style="cursor: pointer" @click="showPass = !showPass" >
+      <font-awesome-icon :icon="!showPass ?'eye-slash': 'eye'" class="right-icon" />
+    </div>
     <font-awesome-icon v-if="icon && !isAlignLeftIcon" :icon="icon" class="right-icon" />
   </div>
 </template>
@@ -77,12 +80,17 @@ export default {
     autocomplete: {
       type: String,
       default: 'on'
+    },
+    showPassword: {
+      type: Boolean,
+      default: false
     }
   },
   data () {
     return {
       inputValue: this.value,
-      focus: false
+      focus: false,
+      showPass: false
     }
   },
   computed: {
@@ -94,6 +102,12 @@ export default {
         return true
       }
       return false
+    },
+    toggleType () {
+      if (this.showPass) {
+        return 'text'
+      }
+      return this.type
     }
   },
   watch: {
diff --git a/resources/assets/js/components/base/modal/CategoryModal.vue b/resources/assets/js/components/base/modal/CategoryModal.vue
index 81863ac8..609e1d85 100644
--- a/resources/assets/js/components/base/modal/CategoryModal.vue
+++ b/resources/assets/js/components/base/modal/CategoryModal.vue
@@ -3,7 +3,7 @@
     <form action="" @submit.prevent="submitCategoryData">
       <div class="card-body">
         <div class="form-group row">
-          <label class="col-sm-4 col-form-label">{{ $t('expenses.category') }}<span class="required text-danger">*</span></label>
+          <label class="col-sm-4 col-form-label input-label">{{ $t('expenses.category') }}<span class="required text-danger">*</span></label>
           <div class="col-sm-7">
             <base-input
               ref="name"
diff --git a/resources/assets/js/components/base/modal/CustomerModal.vue b/resources/assets/js/components/base/modal/CustomerModal.vue
index 5c27bfcf..dc2a03eb 100644
--- a/resources/assets/js/components/base/modal/CustomerModal.vue
+++ b/resources/assets/js/components/base/modal/CustomerModal.vue
@@ -7,7 +7,7 @@
           <tab id="basic-home" :name="$t('customers.basic_info')">
             <div class="basic-info">
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.display_name') }} <span class="required">*</span></label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.display_name') }} <span class="required">*</span></label>
                 <div class="col-sm-7">
                   <base-input
                     ref="name"
@@ -25,7 +25,7 @@
                 </div>
               </div>
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.primary_display_name') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.primary_display_name') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     v-model="formData.contact_name"
@@ -34,7 +34,7 @@
                 </div>
               </div>
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('login.email') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('login.email') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     :invalid="$v.formData.email.$error"
@@ -49,7 +49,7 @@
                 </div>
               </div>
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $tc('settings.currencies.currency') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $tc('settings.currencies.currency') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="currency"
@@ -64,7 +64,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.phone') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.phone') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     :invalid="$v.formData.phone.$error"
@@ -79,7 +79,7 @@
                 </div>
               </div>
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.website') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.website') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     v-model="formData.website"
@@ -100,7 +100,7 @@
           <tab id="basic-profile" :name="$t('customers.billing_address')">
             <div class="basic-info">
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.name') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.name') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     v-model="billing.name"
@@ -110,7 +110,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.phone') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.phone') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     :invalid="$v.billing.phone.$error"
@@ -126,7 +126,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.address') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.address') }}</label>
                 <div class="col-sm-7">
                   <base-text-area
                     v-model="billing.address_street_1"
@@ -155,7 +155,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.country') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.country') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="billingCountry"
@@ -171,7 +171,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.state') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.state') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="billingState"
@@ -187,7 +187,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.city') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.city') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="billingCity"
@@ -213,7 +213,7 @@
               </div> -->
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.zip_code') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.zip_code') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     v-model="billing.zip"
@@ -236,7 +236,7 @@
                 </div>
               </div>
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.name') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.name') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     v-model="shipping.name"
@@ -246,7 +246,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.phone') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.phone') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     :invalid="$v.shipping.phone.$error"
@@ -262,7 +262,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.address') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.address') }}</label>
                 <div class="col-sm-7">
                   <base-text-area
                     v-model="shipping.address_street_1"
@@ -291,7 +291,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.country') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.country') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="shippingCountry"
@@ -307,7 +307,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.state') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.state') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="shippingState"
@@ -323,7 +323,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.city') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.city') }}</label>
                 <div class="col-sm-7">
                   <base-select
                     v-model="shippingCity"
@@ -339,7 +339,7 @@
               </div>
 
               <div class="form-group row">
-                <label class="col-sm-4 col-form-label">{{ $t('customers.zip_code') }}</label>
+                <label class="col-sm-4 col-form-label input-label">{{ $t('customers.zip_code') }}</label>
                 <div class="col-sm-7">
                   <base-input
                     v-model="shipping.zip"
diff --git a/resources/assets/js/components/base/modal/ItemModal.vue b/resources/assets/js/components/base/modal/ItemModal.vue
index 17809aef..439f55bd 100644
--- a/resources/assets/js/components/base/modal/ItemModal.vue
+++ b/resources/assets/js/components/base/modal/ItemModal.vue
@@ -3,7 +3,7 @@
     <form action="" @submit.prevent="submitItemData">
       <div class="card-body">
         <div class="form-group row">
-          <label class="col-sm-4 col-form-label">
+          <label class="col-sm-4 col-form-label input-label">
             {{ $t('items.name') }}<span class="required">*</span>
           </label>
           <div class="col-sm-7">
@@ -22,7 +22,7 @@
           </div>
         </div>
         <div class="form-group row">
-          <label class="col-sm-4 col-form-label">{{ $t('items.price') }}<span class="required">*</span></label>
+          <label class="col-sm-4 col-form-label input-label">{{ $t('items.price') }}<span class="required">*</span></label>
           <div class="col-sm-7">
             <div class="base-input">
               <money
@@ -41,7 +41,7 @@
           </div>
         </div>
         <div class="form-group row">
-          <label class="col-sm-4 col-form-label">{{ $t('items.unit') }}</label>
+          <label class="col-sm-4 col-form-label input-label">{{ $t('items.unit') }}</label>
           <div class="col-sm-7">
             <base-select
               v-model="formData.unit"
@@ -54,7 +54,7 @@
         </div>
 
         <div class="form-group row">
-          <label class="col-sm-4 col-form-label">{{ $t('items.description') }}</label>
+          <label class="col-sm-4 col-form-label input-label">{{ $t('items.description') }}</label>
           <div class="col-sm-7">
             <base-text-area
               v-model="formData.description"
@@ -121,7 +121,8 @@ export default {
         { name: 'kg', value: 'kg' },
         { name: 'km', value: 'km' },
         { name: 'lb', value: 'lb' },
-        { name: 'mg', value: 'mg' }
+        { name: 'mg', value: 'mg' },
+        { name: 'pc', value: 'pc' }
       ],
       formData: {
         name: null,
diff --git a/resources/assets/js/plugins/en.js b/resources/assets/js/plugins/en.js
index 0b1d9cbd..e82216ff 100644
--- a/resources/assets/js/plugins/en.js
+++ b/resources/assets/js/plugins/en.js
@@ -611,8 +611,6 @@ export default {
       estimate_viewed_desc: 'When your customer views the estimate sent via crater dashboard.',
       save: 'Save',
       email_save_message: 'Email saved successfully',
-      // invoice_viewed_message: 'Invoice viewed updated successfully',
-      // estimate_viewed_message: 'Estimate viewed updated successfully',
       please_enter_email: 'Please Enter Email'
     },
     tax_types: {
@@ -622,7 +620,6 @@ export default {
       add_new_tax: 'Add New Tax',
       tax_settings: 'Tax Settings',
       tax_per_item: 'Tax Per Item',
-      // tax_per_item_switch: 'Tax Per Item updated successfully',
       tax_name: 'Tax Name',
       compound_tax: 'Compound Tax',
       percent: 'Percent',
@@ -660,7 +657,6 @@ export default {
       preference: 'Preference | Preferences',
       general_settings: 'Default preferences for the system.',
       updated_message: 'Preferences updated successfully',
-      // set_discount_per_item_message: 'Discount set per item updated successfully',
       select_language: 'select language',
       select_time_zone: 'select Time Zone',
       select_date_formate: 'select Date Formate',
diff --git a/resources/assets/js/plugins/es.js b/resources/assets/js/plugins/es.js
index 73454af7..69ca6255 100644
--- a/resources/assets/js/plugins/es.js
+++ b/resources/assets/js/plugins/es.js
@@ -529,7 +529,8 @@ export default {
       preferences: 'Preferencias',
       notifications: 'Notificaciones',
       tax_types: 'Tipos de impuestos',
-      expense_category: 'Categorías de gastos'
+      expense_category: 'Categorías de gastos',
+      update_app: 'Actualizar aplicación'
     },
     title: 'Configuraciones',
     setting: 'Configuraciones | Configuraciones',
@@ -661,6 +662,11 @@ export default {
       select_time_zone: 'selecciona la zona horaria',
       select_date_formate: 'seleccione formato de fecha',
       select_financial_year: 'seleccione año financiero'
+    },
+    update_app: {
+      title: 'Actualizar aplicación',
+      description: 'actualizar la descripción de la aplicación',
+      update: 'Actualizar'
     }
   },
   wizard: {
diff --git a/resources/assets/js/plugins/fr.js b/resources/assets/js/plugins/fr.js
index 27d9c312..e55cc8fd 100644
--- a/resources/assets/js/plugins/fr.js
+++ b/resources/assets/js/plugins/fr.js
@@ -529,7 +529,8 @@ export default {
       preferences: 'Préférences',
       notifications: 'Les notifications',
       tax_types: 'Types de taxe',
-      expense_category: 'Catégories de dépenses'
+      expense_category: 'Catégories de dépenses',
+      update_app: "Mise à jour de l'application"
     },
     title: 'Paramètres',
     setting: 'Paramètres | Paramètres',
@@ -664,6 +665,11 @@ export default {
       select_time_zone: 'sélectionnez le fuseau horaire',
       select_date_formate: 'sélectionnez Date Formate',
       select_financial_year: 'sélectionner lexercice'
+    },
+    update_app: {
+      title: "Mise à jour de l'application",
+      description: "mettre à jour la description de l'application",
+      update: 'Mise à jour'
     }
   },
   wizard: {
diff --git a/resources/assets/js/views/dashboard/Dashboard.vue b/resources/assets/js/views/dashboard/Dashboard.vue
index bca6d07b..59c1798b 100644
--- a/resources/assets/js/views/dashboard/Dashboard.vue
+++ b/resources/assets/js/views/dashboard/Dashboard.vue
@@ -168,7 +168,7 @@
           >
             <table-column :label="$t('dashboard.recent_invoices_card.due_on')" show="formattedDueDate" />
             <table-column :label="$t('dashboard.recent_invoices_card.customer')" show="user.name" />
-            <table-column :label="$t('dashboard.recent_invoices_card.amount_due')" sort-as="due_amount">
+            <table-column :label="$t('dashboard.recent_invoices_card.amount_due')" show="due_amount" sort-as="due_amount">
               <template slot-scope="row">
                 <span>{{ $t('dashboard.recent_invoices_card.amount_due') }}</span>
                 <div v-html="$utils.formatMoney(row.due_amount, row.user.currency)"/>
@@ -242,7 +242,7 @@
           >
             <table-column :label="$t('dashboard.recent_estimate_card.date')" show="formattedExpiryDate" />
             <table-column :label="$t('dashboard.recent_estimate_card.customer')" show="user.name" />
-            <table-column :label="$t('dashboard.recent_estimate_card.amount_due')" sort-as="total">
+            <table-column :label="$t('dashboard.recent_estimate_card.amount_due')" show="total" sort-as="total">
               <template slot-scope="row">
                 <span>{{ $t('dashboard.recent_estimate_card.amount_due') }}</span>
                 <div v-html="$utils.formatMoney(row.total, row.user.currency)"/>
diff --git a/resources/assets/js/views/estimates/Create.vue b/resources/assets/js/views/estimates/Create.vue
index 8ecbfc14..5f5a83ad 100644
--- a/resources/assets/js/views/estimates/Create.vue
+++ b/resources/assets/js/views/estimates/Create.vue
@@ -553,6 +553,8 @@ export default {
         if (response.data) {
           this.selectCustomer(response.data.estimate.user_id)
           this.newEstimate = response.data.estimate
+          this.newEstimate.estimate_date = moment(response.data.estimate.estimate_date, 'YYYY-MM-DD').toString()
+          this.newEstimate.expiry_date = moment(response.data.estimate.expiry_date, 'YYYY-MM-DD').toString()
           this.discountPerItem = response.data.discount_per_item
           this.taxPerItem = response.data.tax_per_item
           this.selectedCurrency = this.defaultCurrency
diff --git a/resources/assets/js/views/invoices/Create.vue b/resources/assets/js/views/invoices/Create.vue
index abe44796..e2e43ddd 100644
--- a/resources/assets/js/views/invoices/Create.vue
+++ b/resources/assets/js/views/invoices/Create.vue
@@ -554,6 +554,8 @@ export default {
         if (response.data) {
           this.selectCustomer(response.data.invoice.user_id)
           this.newInvoice = response.data.invoice
+          this.newInvoice.invoice_date = moment(response.data.invoice.invoice_date, 'YYYY-MM-DD').toString()
+          this.newInvoice.due_date = moment(response.data.invoice.due_date, 'YYYY-MM-DD').toString()
           this.discountPerItem = response.data.discount_per_item
           this.taxPerItem = response.data.tax_per_item
           this.selectedCurrency = this.defaultCurrency
diff --git a/resources/assets/js/views/items/Create.vue b/resources/assets/js/views/items/Create.vue
index 5d00a5b5..31e96798 100644
--- a/resources/assets/js/views/items/Create.vue
+++ b/resources/assets/js/views/items/Create.vue
@@ -112,7 +112,8 @@ export default {
         { name: 'kg', value: 'kg' },
         { name: 'km', value: 'km' },
         { name: 'lb', value: 'lb' },
-        { name: 'mg', value: 'mg' }
+        { name: 'mg', value: 'mg' },
+        { name: 'pc', value: 'pc' }
       ],
       formData: {
         name: '',
diff --git a/resources/assets/js/views/items/Index.vue b/resources/assets/js/views/items/Index.vue
index c2370607..2d9e2ea2 100644
--- a/resources/assets/js/views/items/Index.vue
+++ b/resources/assets/js/views/items/Index.vue
@@ -245,7 +245,8 @@ export default {
         { name: 'kg', value: 'kg' },
         { name: 'km', value: 'km' },
         { name: 'lb', value: 'lb' },
-        { name: 'mg', value: 'mg' }
+        { name: 'mg', value: 'mg' },
+        { name: 'pc', value: 'pc' }
       ],
       isRequestOngoing: true,
       filtersApplied: false,
diff --git a/resources/assets/js/views/settings/MailConfig.vue b/resources/assets/js/views/settings/MailConfig.vue
index d8277063..afbf481b 100644
--- a/resources/assets/js/views/settings/MailConfig.vue
+++ b/resources/assets/js/views/settings/MailConfig.vue
@@ -66,8 +66,9 @@
             <base-input
               :invalid="$v.mailConfigData.mail_password.$error"
               v-model.trim="mailConfigData.mail_password"
-              type="mail_password"
+              type="password"
               name="name"
+              show-password
               @input="$v.mailConfigData.mail_password.$touch()"
             />
             <div v-if="$v.mailConfigData.mail_password.$error">
@@ -141,12 +142,12 @@ export default {
   data () {
     return {
       mailConfigData: {
-        mail_driver: 'smtp',
-        mail_host: 'mailtrap.io',
-        mail_port: 2525,
-        mail_username: 'cc3c64516febd4',
-        mail_password: 'e6a0176301f587',
-        mail_encryption: 'tls'
+        mail_driver: '',
+        mail_host: '',
+        mail_port: null,
+        mail_username: '',
+        mail_password: '',
+        mail_encryption: ''
       },
       loading: false,
       mail_drivers: []
@@ -176,18 +177,22 @@ export default {
     }
   },
   mounted () {
-    // this.getMailDrivers()
+    this.loadData()
   },
   methods: {
-    async getMailDrivers () {
+    async loadData () {
       this.loading = true
 
-      let response = await window.axios.get('/api/admin/onboarding/environment/mail')
+      let mailDrivers = await window.axios.get('/api/settings/environment/mail')
+      let mailData = await window.axios.get('/api/settings/environment/mail-env')
 
-      if (response.data) {
-        this.mail_drivers = response.data
-        this.loading = false
+      if (mailDrivers.data) {
+        this.mail_drivers = mailDrivers.data
       }
+      if (mailData.data) {
+        this.mailConfigData = mailData.data
+      }
+      this.loading = false
     },
     async saveEmailConfig () {
       this.$v.mailConfigData.$touch()
@@ -196,7 +201,7 @@ export default {
       }
       this.loading = true
       try {
-        let response = await window.axios.post('/api/admin/onboarding/environment/mail', this.mailConfigData)
+        let response = await window.axios.post('/api/settings/environment/mail', this.mailConfigData)
         if (response.data.success) {
           window.toastr['success'](this.$t('wizard.success.' + response.data.success))
         } else {
diff --git a/resources/assets/js/views/wizard/EmailConfiguration.vue b/resources/assets/js/views/wizard/EmailConfiguration.vue
index e19a2018..ecc92ad5 100644
--- a/resources/assets/js/views/wizard/EmailConfiguration.vue
+++ b/resources/assets/js/views/wizard/EmailConfiguration.vue
@@ -62,6 +62,7 @@
             :invalid="$v.mailConfigData.mail_password.$error"
             v-model.trim="mailConfigData.mail_password"
             type="password"
+            show-password
             name="name"
             @input="$v.mailConfigData.mail_password.$touch()"
           />
diff --git a/resources/assets/plugins/vue-font-awesome/index.js b/resources/assets/plugins/vue-font-awesome/index.js
index be90c9cd..3de7d44e 100644
--- a/resources/assets/plugins/vue-font-awesome/index.js
+++ b/resources/assets/plugins/vue-font-awesome/index.js
@@ -51,6 +51,7 @@ import {
   faEllipsisH,
   faCopy,
   faPaperPlane,
+  faEyeSlash,
   faSyncAlt
 } from '@fortawesome/free-solid-svg-icons'
 import { far } from '@fortawesome/free-regular-svg-icons'
@@ -109,6 +110,7 @@ library.add(
   faFilePdf,
   faEnvelope,
   faEye,
+  faEyeSlash,
   faShare,
   faEllipsisH,
   faCopy,
diff --git a/resources/assets/sass/components/category-modal.scss b/resources/assets/sass/components/category-modal.scss
index 2719c7e5..47aed933 100644
--- a/resources/assets/sass/components/category-modal.scss
+++ b/resources/assets/sass/components/category-modal.scss
@@ -19,3 +19,19 @@
     }
 
 }
+
+@media(max-width: $x-small-breakpoint ) {
+
+    .base-modal {
+
+        .category-modal {
+
+            .input-label {
+                text-align: left;
+            }
+
+        }
+
+    }
+
+}
\ No newline at end of file
diff --git a/resources/assets/sass/components/customer-modal.scss b/resources/assets/sass/components/customer-modal.scss
index c7ecc271..76568b9a 100644
--- a/resources/assets/sass/components/customer-modal.scss
+++ b/resources/assets/sass/components/customer-modal.scss
@@ -34,3 +34,20 @@
     }
 
 }
+
+
+@media(max-width: $x-small-breakpoint ) {
+
+    .base-modal {
+
+        .customer-modal {
+
+            .input-label {
+                text-align: left;
+            }
+
+        }
+
+    }
+
+}
\ No newline at end of file
diff --git a/resources/assets/sass/components/item-modal.scss b/resources/assets/sass/components/item-modal.scss
index 97b4c304..2bb210dc 100644
--- a/resources/assets/sass/components/item-modal.scss
+++ b/resources/assets/sass/components/item-modal.scss
@@ -19,3 +19,20 @@
     }
 
 }
+
+
+@media(max-width: $x-small-breakpoint ) {
+
+    .base-modal {
+
+        .item-modal {
+
+            .input-label {
+                text-align: left;
+            }
+
+        }
+
+    }
+
+}
\ No newline at end of file
diff --git a/resources/assets/sass/pages/estimates/create.scss b/resources/assets/sass/pages/estimates/create.scss
index 3638dd1d..cf767f0f 100644
--- a/resources/assets/sass/pages/estimates/create.scss
+++ b/resources/assets/sass/pages/estimates/create.scss
@@ -58,6 +58,7 @@
 
         .content {
             display: flex;
+            flex:1;
             flex-direction: column;
 
             label {
@@ -445,6 +446,9 @@
                 .estimate-amount {
                     font-size: 18px;
                     color: #55547A;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
                 }
 
                 .total {
@@ -491,7 +495,6 @@
             font-weight: 300;
             font-size: 12px;
             padding-top: 2px;
-            padding-left: 10px;
 
             textarea {
 
diff --git a/resources/assets/sass/pages/invoices/create.scss b/resources/assets/sass/pages/invoices/create.scss
index 6cd9f81a..d7d1fffc 100644
--- a/resources/assets/sass/pages/invoices/create.scss
+++ b/resources/assets/sass/pages/invoices/create.scss
@@ -58,6 +58,7 @@
 
         .content {
             display: flex;
+            flex: 1;
             flex-direction: column;
 
             label {
@@ -445,6 +446,9 @@
                 .invoice-amount {
                     font-size: 18px;
                     color: #55547A;
+                    display: flex;
+                    justify-content: center;
+                    align-items: center;
                 }
 
                 .total {
diff --git a/resources/assets/sass/pages/statuses.scss b/resources/assets/sass/pages/statuses.scss
index e1c304dd..6f98827e 100644
--- a/resources/assets/sass/pages/statuses.scss
+++ b/resources/assets/sass/pages/statuses.scss
@@ -1,6 +1,6 @@
 // Invoice statuses
 
-.inv-status-due {
+.inv-status-overdue {
     background: #FED7D7;
     font-size: 13px;
     color: #9B2C2C;
@@ -15,9 +15,9 @@
 }
 
 .inv-status-unpaid {
-    background: rgba(246, 208, 154, 0.4);
+    background: #F8EDCB;
     font-size: 13px;
-    color: #A96E1A;
+    color: #6C432E;
     padding: 5px 10px;
 }
 
@@ -50,9 +50,9 @@
 }
 
 .inv-status-partially_paid {
-    background: #E1E0EA;
+    background: #C9E3EC;
     font-size: 13px;
-    color: #312F57;
+    color: #1E576C;
     padding: 5px 10px;
 }
 
diff --git a/routes/api.php b/routes/api.php
index 4fa230ff..6fca466d 100644
--- a/routes/api.php
+++ b/routes/api.php
@@ -323,6 +323,21 @@ Route::group(['middleware' => 'api'], function () {
                 'uses' => 'CompanyController@updateSetting'
             ]);
 
+            Route::get('/environment/mail', [
+                'as' => 'admin.environment.mail',
+                'uses' => 'EnvironmentController@getMailDrivers'
+            ]);
+
+            Route::get('/environment/mail-env', [
+                'as' => 'admin.mail.env',
+                'uses' => 'EnvironmentController@getMailEnvironment'
+            ]);
+
+            Route::post('/environment/mail', [
+                'as' => 'admin.environment.mail.save',
+                'uses' => 'EnvironmentController@saveMailEnvironment'
+            ]);
+
         });
 
     });