diff --git a/src/modules/employee-list/components/employee/add-modify-dialog.vue b/src/modules/employee-list/components/employee/add-modify-dialog.vue
index c1976ea..f9c2adf 100644
--- a/src/modules/employee-list/components/employee/add-modify-dialog.vue
+++ b/src/modules/employee-list/components/employee/add-modify-dialog.vue
@@ -10,6 +10,14 @@
 
     const employee_store = useEmployeeStore();
     const current_step = ref<'form' | 'access'>('form');
+    const transition_in_animation = ref('fadeInRight');
+    const transition_out_animation = ref('fadeOutLeft');
+
+    const getNextMenu = (animation_in: string, animation_out: string, next_step: 'form' | 'access') => {
+        transition_in_animation.value = animation_in;
+        transition_out_animation.value = animation_out;
+        current_step.value = next_step;
+    };
 </script>
 
 <template>
@@ -21,22 +29,31 @@
         <q-card
             class="bg-secondary rounded-10"
             :class="$q.dark.isActive ? 'shadow-24' : 'shadow-10'"
-            :style="($q.screen.lt.md ? ' ' : 'max-width: 70vw !important; ') +
+            :style="($q.screen.lt.md ? ' ' : 'max-width: 70vw !important; height: 50vh') +
                 ($q.dark.isActive ? 'border: 2px solid var(--q-accent)' : '')"
         >
-            <q-card-section
-                class="text-weight-bolder text-white text-h5 bg-primary text-center shadow-5 q-pa-none"
-            >
-                <div class="q-py-sm text-uppercase">{{ $t('employee_management.' + employee_store.management_mode) }}</div>
+            <q-card-section class="row text-weight-bolder text-white text-h5 bg-primary flex-center shadow-5 q-pa-none">
+                <div class="q-py-sm text-uppercase">
+                    {{ $t('employee_management.' + employee_store.management_mode) }}
+                </div>
+                <div
+                    v-if="employee_store.employee.first_name.length > 0"
+                    class="text-uppercase text-weight-light text-h6 q-ml-sm"
+                >
+                    {{ `${employee_store.employee.first_name} ${employee_store.employee.last_name}` }}
+                </div>
                 <q-slide-transition>
-                    <div v-if="current_step === 'access'" class="col-12 row flex-center q-px-sm q-py-xs bg-accent">
+                    <div
+                        v-if="current_step === 'access'"
+                        class="col-12 row flex-center q-px-sm q-py-xs bg-accent"
+                    >
                         <q-icon
                             name="info_outline"
                             color="white"
                             size="sm"
                             class="self-end q-mr-sm"
                         />
-    
+
                         <q-item-label
                             caption
                             class="text-white text-weight-medium"
@@ -46,61 +63,50 @@
             </q-card-section>
 
             <q-card-section class="q-pt-sm">
-                <q-carousel
-                    v-model="current_step"
-                    transition-prev="slide-right"
-                    transition-next="slide-left"
-                    animated
-                    control-color="accent"
-                    class="rounded-10 transparent"
-                >
-                    <q-carousel-slide
-                        name="form"
-                        class="q-pt-none"
-                    >
-                        <div class="rounded-5 q-pb-sm bg-dark shadow-10">
-                            <AddModifyDialogForm />
-                        </div>
-                    </q-carousel-slide>
-
-                    <q-carousel-slide
-                        name="access"
-                        class="q-pt-none"
-                    >
-                        <AddModifyDialogAccess />
-                    </q-carousel-slide>
-
-                    <template #control>
-                        <q-carousel-control
-                            position="bottom"
-                            style="margin: none !important;"
+                <div class="full-height column">
+                    <div class="col">
+                        <transition
+                            :enter-active-class="'animated ' + transition_in_animation"
+                            :leave-active-class="'animated ' + transition_out_animation"
+                            mode="out-in"
                         >
-                            <div class="row">
-                                <q-btn
-                                    v-if="current_step === 'access'"
-                                    flat
-                                    size="lg"
-                                    color="accent"
-                                    icon="arrow_back"
-                                    :label="$t('employee_management.details_label')"
-                                    @click="current_step = 'form'"
-                                />
-
-                                <q-space />
-
-                                <q-btn
-                                    v-if="current_step === 'form'"
-                                    flat
-                                    size="lg"
-                                    color="accent"
-                                    icon-right="arrow_forward"
-                                    :label="$t('employee_management.access_label')"
-                                    @click="current_step = 'access'"
-                                />
+                            <div
+                                v-if="current_step === 'form'"
+                                class="rounded-5 q-pb-sm bg-dark shadow-10"
+                            >
+                                <AddModifyDialogForm />
                             </div>
-                        </q-carousel-control>
-                    </template>
-                </q-carousel>
+    
+                            <AddModifyDialogAccess v-else />
+                        </transition>
+                    </div>
+
+
+
+                    <div class="row col-auto">
+                        <q-btn
+                            v-if="current_step === 'access'"
+                            flat
+                            size="lg"
+                            color="accent"
+                            icon="arrow_back"
+                            :label="$t('employee_management.details_label')"
+                            @click="getNextMenu('fadeInLeft', 'fadeOutRight', 'form')"
+                        />
+
+                        <q-space />
+
+                        <q-btn
+                            v-if="current_step === 'form'"
+                            flat
+                            size="lg"
+                            color="accent"
+                            icon-right="arrow_forward"
+                            :label="$t('employee_management.access_label')"
+                            @click="getNextMenu('fadeInRight', 'fadeOutLeft', 'access')"
+                        />
+                    </div>
+                </div>
             </q-card-section>
 
             <q-inner-loading :showing="employee_store.is_loading" />