diff --git a/src/App.js b/src/App.js
index 798ef7d..bfcfc77 100644
--- a/src/App.js
+++ b/src/App.js
@@ -19,10 +19,10 @@ const App = () => {
         <Header />
           <Routes>
             <Route path='*' element={<Directorio/>}></Route>
-            <Route path='/d2' element={<Directorio2/>}></Route>
-            <Route path='/login' element={<Login/>}></Route>
-            <Route path='/MDU' element={<MDUser/>}></Route>
-            <Route path='/CU' element={<CrearUsuario/>}></Route>
+            <Route path='/Formulario' element={<Directorio2/>}></Route>
+            <Route path='/Acceso' element={<Login/>}></Route>
+            <Route path='/Modificacion y Borrado de Usuario' element={<MDUser/>}></Route>
+            <Route path='/Creacion de Usuario' element={<CrearUsuario/>}></Route>
             </Routes>
         <Footer />
       </Router>
diff --git a/src/components/CrearUsuario.css b/src/components/CrearUsuario.css
index 10dbc1b..29dc1de 100644
--- a/src/components/CrearUsuario.css
+++ b/src/components/CrearUsuario.css
@@ -1,57 +1,57 @@
 .crear-usuario-container {
-    max-width: 400px;
-    width: 90%;
-    margin: auto;
-    padding: 1.5em;
-    background: #f0f0f0;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-    border-radius: 8px;
-  }
-  
-  .form-group {
-    margin-bottom: 1em;
-  }
-  
-  label {
-    display: block;
-    margin-bottom: 0.5em;
-  }
-  
-  input[type="text"],
-  input[type="email"],
-  input[type="password"],
-  select {
+  max-width: 400px;
+  width: 90%;
+  margin: 8px auto;
+  padding: 1.5em;
+  background: #f0f0f0;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  border-radius: 8px;
+}
+
+.form-group {
+  margin-bottom: 1em;
+}
+
+label {
+  display: block;
+  margin-bottom: 0.5em;
+}
+
+input[type="text"],
+input[type="email"],
+input[type="password"],
+select {
+  width: 100%;
+  padding: 0.5em;
+  font-size: 1em;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+}
+
+button {
+  width: 100%;
+  padding: 0.6em;
+  font-size: 1em;
+  color: #fff;
+  background-color: #007bff;
+  border: none;
+  border-radius: 12px !important; /* Redondear un poco más el botón */
+  cursor: pointer;
+}
+
+button:hover {
+  background-color: #0056b3;
+}
+
+.required {
+  color: red;
+}
+
+/* Responsiveness */
+@media (max-width: 768px) {
+  .crear-usuario-container {
     width: 100%;
-    padding: 0.5em;
-    font-size: 1em;
-    border: 1px solid #ccc;
-    border-radius: 4px;
+    padding: 1em;
   }
-  
-  button {
-    width: 100%;
-    padding: 0.6em;
-    font-size: 1em;
-    color: #fff;
-    background-color: #007bff;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-  }
-  
-  button:hover {
-    background-color: #0056b3;
-  }
-  
-  .required {
-    color: red;
-  }
-  
-  /* Responsiveness */
-  @media (max-width: 768px) {
-    .crear-usuario-container {
-      width: 100%;
-      padding: 1em;
-    }
-  }
-   
\ No newline at end of file
+}
+ 
\ No newline at end of file
diff --git a/src/components/Formulario.css b/src/components/Formulario.css
index e19788f..bcb4aa8 100644
--- a/src/components/Formulario.css
+++ b/src/components/Formulario.css
@@ -1,7 +1,7 @@
 .formulario-container {
   max-width: 800px;
   width: 90%;
-  margin: auto;
+  margin:  20px auto;
   padding: 1.5em;
   background: white;
   box-shadow: 0 4px 8px 2px rgba(0, 0, 0, 0.1);
diff --git a/src/components/MDUser.css b/src/components/MDUser.css
index 40dd222..e05357e 100644
--- a/src/components/MDUser.css
+++ b/src/components/MDUser.css
@@ -1,75 +1,75 @@
 .md-user-container {
-    max-width: 400px;
-    width: 90%;
-    margin: auto;
-    padding: 1.5em;
-    background: #f0f0f0;
-    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
-    border-radius: 8px;
-  }
-  
-  .form-group {
-    margin-bottom: 1em;
-  }
-  
-  label {
-    display: block;
-    margin-bottom: 0.5em;
-  }
-  
-  input[type="text"],
-  input[type="email"],
-  input[type="password"],
-  select {
+  max-width: 400px;
+  width: 90%;
+  margin: 10px auto;
+  padding: 1.5em;
+  background: #f0f0f0;
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
+  border-radius: 8px;
+}
+
+.form-group {
+  margin-bottom: 1em;
+}
+
+label {
+  display: block;
+  margin-bottom: 0.5em;
+}
+
+input[type="text"],
+input[type="email"],
+input[type="password"],
+select {
+  width: 100%;
+  padding: 0.5em;
+  font-size: 1em;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+}
+
+.button-group {
+  display: flex;
+  justify-content: space-between;
+  margin-top: 1em;
+}
+
+.modificar-button,
+.borrar-button {
+  padding: 0.6em;
+  font-size: 1em;
+  color: #fff;
+  border: none;
+  border-radius: 4px;
+  cursor: pointer;
+  margin: 0 5px;
+}
+
+.modificar-button {
+  background-color: #007bff;
+}
+
+.modificar-button:hover {
+  background-color: #0056b3;
+}
+
+.borrar-button {
+  background-color: #dc3545;
+}
+
+.borrar-button:hover {
+  background-color: #c82333;
+}
+
+/* Responsiveness */
+@media (max-width: 768px) {
+  .md-user-container {
     width: 100%;
-    padding: 0.5em;
-    font-size: 1em;
-    border: 1px solid #ccc;
-    border-radius: 4px;
+    padding: 1em;
   }
-  
-  .button-group {
-    display: flex;
-    justify-content: space-between;
-    margin-top: 1em;
-  }
-  
-  .modificar-button,
-  .borrar-button {
-    padding: 0.6em;
-    font-size: 1em;
-    color: #fff;
-    border: none;
-    border-radius: 4px;
-    cursor: pointer;
-  }
-  
-  .modificar-button {
-    background-color: #007bff;
-  }
-  
-  .modificar-button:hover {
-    background-color: #0056b3;
-  }
-  
-  .borrar-button {
-    background-color: #dc3545;
-  }
-  
-  .borrar-button:hover {
-    background-color: #c82333;
-  }
-  
-  /* Responsiveness */
-  @media (max-width: 768px) {
-    .md-user-container {
-      width: 100%;
-      padding: 1em;
-    }
-  }
-  .required {
-    color: red;
-    margin-left: 5px; /* Ajusta el margen a tu preferencia */
-  }
-  
-  
\ No newline at end of file
+}
+
+.required {
+  color: red;
+  margin-left: 5px;
+}
diff --git a/src/components/MDUser.js b/src/components/MDUser.js
index 543bc2e..471e0a9 100644
--- a/src/components/MDUser.js
+++ b/src/components/MDUser.js
@@ -33,7 +33,7 @@ const MDUser = ({ usuario }) => {
   };
 
   return (
-    <div className="md-user-container">
+    <div className="md-user-container" style={{ backgroundColor: '#d59f0f' }}>
       <div className="form-group">
         <label htmlFor="nombreCompleto">Nombre completo:<span className="required">*</span></label>
         <input
diff --git a/src/components/Mapeo.js b/src/components/Mapeo.js
index 197cc1b..a042741 100644
--- a/src/components/Mapeo.js
+++ b/src/components/Mapeo.js
@@ -52,6 +52,26 @@ const Mapeo = ({ filters }) => {
     }
   };
 
+  const getPageNumbers = () => {
+    const maxPagesToShow = 6;
+    const halfRange = Math.floor(maxPagesToShow / 2);
+    let start = Math.max(1, currentPage - halfRange);
+    let end = Math.min(totalPages, currentPage + halfRange);
+
+    if (currentPage - halfRange < 1) {
+      end = Math.min(totalPages, end + (halfRange - currentPage + 1));
+    }
+    if (currentPage + halfRange > totalPages) {
+      start = Math.max(1, start - (currentPage + halfRange - totalPages));
+    }
+
+    const pages = [];
+    for (let i = start; i <= end; i++) {
+      pages.push(i);
+    }
+    return pages;
+  };
+
   return (
     <div className="main-content">
       {profesores.map(profesor => {
@@ -69,10 +89,10 @@ const Mapeo = ({ filters }) => {
               Anterior
             </a>
           </li>
-          {Array.from({ length: totalPages }, (_, index) => (
-            <li key={index + 1} className={`page-item ${currentPage === index + 1 ? 'active' : ''}`}>
-              <a className="page-link" href="#" onClick={() => setCurrentPage(index + 1)}>
-                {index + 1}
+          {getPageNumbers().map(page => (
+            <li key={page} className={`page-item ${currentPage === page ? 'active' : ''}`}>
+              <a className="page-link" href="#" onClick={() => setCurrentPage(page)}>
+                {page}
               </a>
             </li>
           ))}
diff --git a/src/pages/MDUser.js b/src/pages/MDUser.js
index 991e14e..33b7bb4 100644
--- a/src/pages/MDUser.js
+++ b/src/pages/MDUser.js
@@ -3,7 +3,7 @@ import MDUser from '../components/MDUser';
 
 const Directorio = () => {
   return (
-    <div className=" ">
+    <div className="Modificar y Borrar Usuario">
       <MDUser/>
     </div>
   );