diff --git a/components/TablaServiciosSociales.vue b/components/TablaServiciosSociales.vue
index 00ee91b..ad86aad 100644
--- a/components/TablaServiciosSociales.vue
+++ b/components/TablaServiciosSociales.vue
@@ -275,7 +275,11 @@ export default {
             this.servicioSelected.idCasoEspecial
           )
         this.$router.push(this.path)
-      } else if (this.servicioSelected.idServicio) this.servicioSelected = {}
+      } else if (
+        this.servicioSelected.idServicio ||
+        this.servicioSelected.idCasoEspecial
+      )
+        this.servicioSelected = {}
     },
   },
 }
diff --git a/components/casoEspecial/TablaServiciosEspeciales.vue b/components/casoEspecial/TablaServiciosEspeciales.vue
new file mode 100644
index 0000000..f41826a
--- /dev/null
+++ b/components/casoEspecial/TablaServiciosEspeciales.vue
@@ -0,0 +1,148 @@
+<template>
+  <div class="mb-6">
+    <h3 class="title">Casos Especiales</h3>
+
+    <div class="columns">
+      <b-field class="column" label="Número de Cuenta">
+        <b-input
+          type="text"
+          icon="school"
+          placeholder="No.Cuenta"
+          maxlength="9"
+          @keyup.enter.native="obtenerCasosEspeciales()"
+          v-model="search.numeroCuenta"
+          rounded
+        />
+      </b-field>
+
+      <b-field class="column" label="Nombre">
+        <b-input
+          type="name"
+          icon="account"
+          placeholder="Nombre"
+          @keyup.enter.native="obtenerCasosEspeciales()"
+          v-model="search.nombre"
+          rounded
+        />
+      </b-field>
+
+      <b-field class="column" label="Status">
+        <b-select icon="information" v-model="search.idStatus" expanded rounded>
+          <option value="">Status</option>
+
+          <option
+            v-for="(s, i) in status"
+            :key="i"
+            :value="s.idStatus"
+            v-show="i > 8 && i < 14"
+          >
+            {{ s.status }}
+          </option>
+        </b-select>
+      </b-field>
+
+      <div class="column is-align-self-center">
+        <b-button
+          type="is-info"
+          @click="obtenerCasosEspeciales()"
+          expanded
+          rounded
+        >
+          Buscar
+        </b-button>
+      </div>
+    </div>
+
+    <TablaServiciosSociales
+      :columnaFechaFin="false"
+      :columnaFechaInicio="false"
+      :isLoading="isLoading"
+      :idTipoUsuario="responsable.idTipoUsuario"
+      :page="page"
+      :total="total"
+      :data="data"
+      :onPageChange="onPageChange"
+    />
+  </div>
+</template>
+
+<script>
+import axios from 'axios'
+import TablaServiciosSociales from '@/components/TablaServiciosSociales'
+
+export default {
+  components: { TablaServiciosSociales },
+  props: {
+    responsable: { type: Object, required: true },
+    imprimirError: { type: Function, required: true },
+  },
+  data() {
+    return {
+      isLoading: false,
+      page: 1,
+      total: 0,
+      data: [],
+      status: [],
+      search: {
+        idStatus: '',
+      },
+      searchAnterior: {},
+    }
+  },
+  methods: {
+    onPageChange(page) {
+      this.page = page
+      this.obtenerCasosEspeciales()
+    },
+    obtenerCasosEspeciales() {
+      let data = ''
+
+      this.isLoading = true
+      if (
+        this.search.numeroCuenta != this.searchAnterior.numeroCuenta ||
+        this.search.nombre != this.searchAnterior.nombre ||
+        this.search.idStatus != this.searchAnterior.idStatus
+      ) {
+        this.page = 1
+        this.searchAnterior.numeroCuenta = this.search.numeroCuenta
+        this.searchAnterior.nombre = this.search.nombre
+        this.searchAnterior.idStatus = this.search.idStatus
+      }
+      if (this.search.idStatus) data += `&idStatus=${this.search.idStatus}`
+      if (this.search.nombre) data += `&nombre=${this.search.nombre}`
+      if (this.search.numeroCuenta)
+        data += `&numeroCuenta=${this.search.numeroCuenta}`
+      axios
+        .get(
+          `${process.env.api}/caso_especial/servicios_especiales?pagina=${this.page}${data}`,
+          this.responsable.token
+        )
+        .then((res) => {
+          this.data = res.data.serviciosEspeciales
+          this.total = res.data.count
+          this.isLoading = false
+        })
+        .catch((err) => {
+          this.isLoading = false
+          this.imprimirError(err.response.data)
+        })
+    },
+    obtenerCatalogoStatus() {
+      axios
+        .get(`${process.env.api}/status`, this.responsable.token)
+        .then((res) => {
+          this.status = res.data
+          this.obtenerCasosEspeciales()
+        })
+        .catch((err) => {
+          this.imprimirError(err.response.data)
+        })
+    },
+  },
+  created() {
+    if (this.responsable.idTipoUsuario === 4) this.obtenerCatalogoStatus()
+  },
+}
+</script>
+
+<style scoped></style>
diff --git a/components/casoEspecial/tablaServicios.vue b/components/casoEspecial/tablaServicios.vue
deleted file mode 100644
index 5a54ad4..0000000
--- a/components/casoEspecial/tablaServicios.vue
+++ /dev/null
@@ -1,232 +0,0 @@
-<template>
-  <div class="mb-6">
-    <h3 class="title">Casos Especiales</h3>
-
-    <div class="columns">
-      <b-field class="column" label="Número de Cuenta">
-        <b-input
-          type="text"
-          icon="school"
-          placeholder="No.Cuenta"
-          maxlength="9"
-          @keyup.enter.native="obtenerCasosEspeciales()"
-          v-model="busqueda.numeroCuenta"
-          rounded
-        ></b-input>
-      </b-field>
-
-      <b-field class="column" label="Nombre">
-        <b-input
-          type="name"
-          icon="account"
-          placeholder="Nombre"
-          @keyup.enter.native="obtenerCasosEspeciales()"
-          v-model="busqueda.nombre"
-          rounded
-        ></b-input>
-      </b-field>
-
-      <b-field class="column" label="Status">
-        <b-select
-          icon="information"
-          v-model="busqueda.idStatus"
-          expanded
-          rounded
-        >
-          <option value="">Status</option>
-
-          <option
-            v-for="(s, i) in status"
-            :key="i"
-            :value="s.idStatus"
-            v-show="i > 8 && i < 14"
-          >
-            {{ s.status }}
-          </option>
-        </b-select>
-      </b-field>
-
-      <div class="column is-align-self-center">
-        <b-button
-          type="is-info"
-          @click="obtenerCasosEspeciales()"
-          expanded
-          rounded
-        >
-          Buscar
-        </b-button>
-      </div>
-    </div>
-
-    <b-table
-      :data="data"
-      :total="total"
-      :current-page="page"
-      :per-page="perPage"
-      :loading="isLoading"
-      @page-change="onPageChange"
-      hoverable
-      striped
-      paginated
-      backend-pagination
-    >
-      <b-table-column
-        field="numeroCuenta"
-        label="Número de Cuenta"
-        v-slot="props"
-        centered
-      >
-        <span>{{ props.row.Usuario.usuario }}</span>
-      </b-table-column>
-
-      <b-table-column field="nombre" label="Nombre" v-slot="props" centered>
-        <span>{{ props.row.Usuario.nombre }}</span>
-      </b-table-column>
-
-      <b-table-column field="carrera" label="Carrera" v-slot="props" centered>
-        <span>{{ props.row.Carrera.carrera }}</span>
-      </b-table-column>
-
-      <b-table-column
-        field="fechaCreado"
-        label="Día de Creación"
-        v-slot="props"
-        centered
-      >
-        <span>{{ fecha(props.row.createdAt) }}</span>
-      </b-table-column>
-
-      <b-table-column field="status" label="Status" v-slot="props" centered>
-        <span :class="types(props.row.Status.idStatus)">{{
-          props.row.Status.status
-        }}</span>
-      </b-table-column>
-    </b-table>
-  </div>
-</template>
-
-<script>
-import axios from 'axios'
-import moment from 'moment'
-
-export default {
-  data() {
-    return {
-      admin: {},
-      status: [],
-      data: [],
-      page: 1,
-      perPage: 25,
-      total: 0,
-      isLoading: false,
-      busqueda: {
-        idStatus: '',
-      },
-      busquedaAnterior: {},
-      token: {},
-    }
-  },
-  methods: {
-    fecha(date) {
-      if (date) {
-        const fecha = moment(date)
-
-        return `${fecha.date() < 10 ? '0' + fecha.date() : fecha.date()}/${
-          fecha.month() < 9 ? '0' + (fecha.month() + 1) : fecha.month() + 1
-        }/${fecha.year()}`
-      }
-      return ''
-    },
-    types(idStatus) {
-      let style = 'tag'
-
-      if (idStatus === 10) style += ' is-danger'
-      if (idStatus === 11) style += ' is-link is-light'
-      if (idStatus === 12) style += ' is-danger is-light'
-      if (idStatus === 13 || idStatus === 14) style += ' is-success is-light'
-      return style
-    },
-    onPageChange(page) {
-      this.page = page
-      this.obtenerCasosEspeciales()
-    },
-    obtenerCasosEspeciales() {
-      let data = ''
-
-      this.isLoading = true
-      if (
-        this.busqueda.numeroCuenta != this.busquedaAnterior.numeroCuenta ||
-        this.busqueda.nombre != this.busquedaAnterior.nombre ||
-        this.busqueda.idStatus != this.busquedaAnterior.idStatus
-      ) {
-        this.page = 1
-        this.busquedaAnterior.numeroCuenta = this.busqueda.numeroCuenta
-        this.busquedaAnterior.nombre = this.busqueda.nombre
-        this.busquedaAnterior.idStatus = this.busqueda.idStatus
-      }
-      if (this.busqueda.idStatus) data += `&idStatus=${this.busqueda.idStatus}`
-      if (this.busqueda.nombre) data += `&nombre=${this.busqueda.nombre}`
-      if (this.busqueda.numeroCuenta)
-        data += `&numeroCuenta=${this.busqueda.numeroCuenta}`
-      axios
-        .get(
-          `${process.env.api}/caso_especial/servicios_especiales?&pagina=${this.page}${data}`,
-          this.token
-        )
-        .then((res) => {
-          this.data = res.data.serviciosEspeciales
-          this.total = res.data.count
-          this.isLoading = false
-        })
-        .catch((err) => {
-          this.isLoading = false
-          this.imprimirError(err.response.data)
-        })
-    },
-    obtenerCatalogoStatus() {
-      axios
-        .get(`${process.env.api}/status`, this.token)
-        .then((res) => {
-          this.status = res.data
-        })
-        .catch((err) => {
-          this.imprimirError(err.response.data)
-        })
-    },
-    imprimirError(err) {
-      this.$buefy.dialog.alert({
-        title: 'Error',
-        message: err.message,
-        type: 'is-danger',
-        hasIcon: true,
-        icon: 'alert-circle',
-        ariaRole: 'alertdialog',
-        ariaModal: true,
-      })
-      if (err.err === 'token error') {
-        localStorage.clear()
-        this.$router.push('/')
-      }
-    },
-    getLocalhostInfo() {
-      this.admin.idUsuario = localStorage.getItem('idUsuario')
-      this.admin.idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'))
-      this.admin.tipoUsuario = localStorage.getItem('tipoUsuario')
-      this.token = {
-        headers: {
-          token: localStorage.getItem('token'),
-        },
-      }
-    },
-  },
-  created() {
-    this.getLocalhostInfo()
-    if (this.admin.idTipoUsuario === 4) {
-      this.obtenerCatalogoStatus()
-      this.obtenerCasosEspeciales()
-    }
-  },
-}
-</script>
-
-<style scoped></style>
diff --git a/components/responsable/CuestionarioResponasble.vue b/components/responsable/CuestionarioResponasble.vue
index 869e7b4..b0a27fd 100644
--- a/components/responsable/CuestionarioResponasble.vue
+++ b/components/responsable/CuestionarioResponasble.vue
@@ -19,8 +19,8 @@
       <div>
         <b-field v-for="(a, i) in actividades" :key="i">
           <b-input
-            :placeholder="`${i + 1})`"
             maxlength="400"
+            :placeholder="`${i + 1})`"
             v-model="actividades[i]"
           />
         </b-field>
@@ -46,14 +46,14 @@
     </div>
 
     <b-field
-      label=" 6. De acuerdo a lo observado ¿cuáles considera que son las cualidades de
+      label="6) De acuerdo a lo observado ¿cuáles considera que son las cualidades de
       nuestros alumnos de esta licenciatura?"
     >
       <b-input placeholder="Respuesta" maxlength="800" v-model="p6" />
     </b-field>
 
     <b-field
-      label=" 7. De acuerdo a lo observado ¿cuáles considera que son los aspectos a
+      label="7) De acuerdo a lo observado ¿cuáles considera que son los aspectos a
         mejorar en la formación de nuestros alumnos de esta licenciatura?"
     >
       <b-input placeholder="Respuesta" maxlength="800" v-model="p7" />
diff --git a/pages/admin/index.vue b/pages/admin/index.vue
index 8c2a120..f76706a 100644
--- a/pages/admin/index.vue
+++ b/pages/admin/index.vue
@@ -1,5 +1,5 @@
 <template>
-  <section class="container px-2 pb-6">
+  <div class="container px-2 pb-6">
     <div class="pb-5 pt-6">
       <b-button type="is-info" tag="router-link" to="/admin/responsables">
         Ver responsables
@@ -20,7 +20,7 @@
       :imprimirWarning="imprimirWarning"
       :imprimirError="imprimirError"
     />
-  </section>
+  </div>
 </template>
 
 <script>
diff --git a/pages/casoEspecial/index.vue b/pages/casoEspecial/index.vue
index 3e30fed..2e469c5 100644
--- a/pages/casoEspecial/index.vue
+++ b/pages/casoEspecial/index.vue
@@ -1,37 +1,28 @@
 <template>
-  <section class="container px-2">
-    <div class="mb-5 mb-6">
+  <div class="container px-2 pb-6">
+    <div class="pb-5 pt-6">
       <b-button type="is-info" tag="router-link" to="/casoEspecial/nuevo">
-        Agregar alumno
+        Nuevo Caso Especial
       </b-button>
     </div>
 
-    <TablaServicios
-      :admin="admin"
-      :imprimirMensaje="imprimirMensaje"
-      :imprimirWarning="imprimirWarning"
+    <TablaServiciosEspeciales
+      :responsable="responsable"
       :imprimirError="imprimirError"
     />
-  </section>
+  </div>
 </template>
 
 <script>
-import TablaServicios from '@/components/casoEspecial/tablaServicios'
+import TablaServiciosEspeciales from '@/components/casoEspecial/TablaServiciosEspeciales'
 
 export default {
   components: {
-    TablaServicios,
-  },
-  beforeCreate() {
-    const idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'))
-
-    if (idTipoUsuario === 1) this.$router.push('/admin')
-    if (idTipoUsuario === 2) this.$router.push('/alumno')
-    if (idTipoUsuario === 3) this.$router.push('/alumno')
+    TablaServiciosEspeciales,
   },
   data() {
     return {
-      admin: {},
+      responsable: {},
     }
   },
   methods: {
@@ -53,47 +44,13 @@ export default {
         this.$router.push('/')
       }
     },
-    imprimirMensaje(message, title = '¡Felicidades!', onConfirm = () => {}) {
-      this.$buefy.dialog.alert({
-        ariaRole: 'alertdialog',
-        ariaModal: true,
-        type: 'is-success',
-        title,
-        message,
-        confirmText: 'Ok',
-        hasIcon: true,
-        iconPack: 'mdi',
-        icon: 'check-circle',
-        onConfirm: () => onConfirm(),
-      })
-    },
-    imprimirWarning(
-      message,
-      onConfirm = () => {},
-      title = '¡Espera un minuto!',
-      onCancel = () => {}
-    ) {
-      this.$buefy.dialog.alert({
-        ariaRole: 'alertdialog',
-        ariaModal: true,
-        type: 'is-warning',
-        title,
-        message,
-        confirmText: 'Confirmar',
-        canCancel: true,
-        cancelText: 'Cancelar',
-        hasIcon: true,
-        iconPack: 'mdi',
-        icon: 'help-circle',
-        onConfirm: () => onConfirm(),
-        onCancel: () => onCancel(),
-      })
-    },
     getLocalhostInfo() {
-      this.admin.idUsuario = Number(localStorage.getItem('idUsuario'))
-      this.admin.idTipoUsuario = Number(localStorage.getItem('idTipoUsuario'))
-      this.admin.tipoUsuario = localStorage.getItem('tipoUsuario')
-      this.admin.token = {
+      this.responsable.idUsuario = Number(localStorage.getItem('idUsuario'))
+      this.responsable.idTipoUsuario = Number(
+        localStorage.getItem('idTipoUsuario')
+      )
+      this.responsable.tipoUsuario = localStorage.getItem('tipoUsuario')
+      this.responsable.token = {
         headers: {
           token: localStorage.getItem('token'),
         },
@@ -102,9 +59,9 @@ export default {
   },
   created() {
     this.getLocalhostInfo()
-    if (this.admin.idTipoUsuario === 1) this.$router.push('/admin')
-    if (this.admin.idTipoUsuario === 2) this.$router.push('/responsable')
-    if (this.admin.idTipoUsuario === 3) this.$router.push('/alumno')
+    if (this.responsable.idTipoUsuario === 1) this.$router.push('/admin')
+    if (this.responsable.idTipoUsuario === 2) this.$router.push('/responsable')
+    if (this.responsable.idTipoUsuario === 3) this.$router.push('/alumno')
   },
 }
 </script>