diff --git a/frontend/src/views/Dashboard/Dashboard.module.css b/frontend/src/views/Dashboard/Dashboard.module.css
deleted file mode 100644
index 539ee2d..0000000
--- a/frontend/src/views/Dashboard/Dashboard.module.css
+++ /dev/null
@@ -1,77 +0,0 @@
-.main-0 {
-    width: 100%;
-    min-height: calc(100% - 174px);
-    background-color: #ffffff;
-    overflow-y: auto;
-}
-.main-1 {
-    width: 100%;
-    min-height: calc(100% - 144px);
-    background-color: #ffffff;
-    overflow-y: auto;
-}
-.validate-information {
-    background-color: #d83341;
-    color: #ffffff;
-    font-family: 'SourceSansPro-SemiBold', serif;
-    font-size: 14px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    height: 30px;
-    margin-left: auto;
-    margin-right: auto;
-    width: 100%;
-}
-.validate-icon {
-    width: 20px;
-    height: 20px;
-    margin-right: 6px;
-}
-.validate-icon:hover {
-    cursor: pointer;
-}
-.container {
-    width: 90%;
-    max-width: 1236px;
-    margin: auto;
-    height: 100%;
-    min-height: 100%;
-    color: #0f1f39;
-}
-.container-component {
-    width: calc(100% - 250px);
-    height: 100%;
-    overflow: auto;
-}
-@media only screen and (max-width: 1440px) and (min-width: 1281px) {
-}
-@media only screen and (max-width: 1280px) and (min-width: 801px) {
-}
-@media only screen and (max-width: 800px) {
-    .container-component {
-        width: 100%;
-    }
-    .validate-information {
-        font-size: 13px;
-        height: 56px;
-    }
-    .validate-icon {
-        width: 26px;
-        height: 26px;
-        margin-right: 6px;
-        margin-left: 6px;
-    }
-    .main-1 {
-        width: 100%;
-        min-height: calc(100% - 108px);
-        background: #ffffff;
-        overflow-y: auto;
-    }
-    .main-0 {
-        width: 100%;
-        min-height: calc(100% - 164px);
-        background: #ffffff;
-        overflow-y: auto;
-    }
-}
diff --git a/frontend/src/views/Dashboard/index.jsx b/frontend/src/views/Dashboard/index.jsx
index 5b400ed..6451283 100644
--- a/frontend/src/views/Dashboard/index.jsx
+++ b/frontend/src/views/Dashboard/index.jsx
@@ -1,8 +1,6 @@
 import React, { useState } from 'react';
 import { Outlet } from 'react-router-dom';
 import { useSelector } from 'react-redux';
-//styles
-import Styles from './Dashboard.module.css';
 //components
 import Navbar from '../../components/Navbar';
 import Footer from './../../components/Footer';
@@ -12,19 +10,22 @@ import { IoCloseCircleOutline } from 'react-icons/io5';
 const Dashboard = () => {
     const { user } = useSelector((state) => state.auth);
     const [alert, setAlert] = useState(true);
+    const needsAccountInfo = !user.first_name || !user.last_name;
+    const showAccountAlert = needsAccountInfo && alert;
     const options = [
         { to: 'my-courses', text: 'Mis Cursos', permissions: [] },
         { to: 'available-courses', text: 'Cursos Disponibles', permissions: [] },
         { to: 'postulations', text: 'Postulaciones', permissions: [] },
         { to: 'community', text: 'Comunidad', permissions: [] }
     ];
+
     return (
         <>
             <Navbar options={options} path="dashboard" />
-            {(!user.first_name || !user.last_name) && alert && (
-                <p className={Styles[`validate-information`]}>
+            {showAccountAlert && (
+                <p className="mx-auto flex h-14 w-full items-center justify-center bg-[#d83341] px-3 text-center font-['SourceSansPro-SemiBold'] text-[13px] text-white sm:h-[30px] sm:text-sm">
                     <IoCloseCircleOutline
-                        className={Styles[`validate-icon`]}
+                        className="mr-1.5 h-[26px] w-[26px] shrink-0 cursor-pointer sm:h-5 sm:w-5"
                         onClick={() => setAlert(false)}
                     />
                     Recuerda que para utilizar la plataforma es necesario completar algunos datos en
@@ -33,10 +34,12 @@ const Dashboard = () => {
             )}
             <div
                 className={
-                    Styles[`main-${(!user.first_name || !user.last_name) && alert ? '0' : '1'}`]
+                    showAccountAlert
+                        ? 'min-h-[calc(100%_-_164px)] w-full overflow-y-auto bg-white sm:min-h-[calc(100%_-_174px)]'
+                        : 'min-h-[calc(100%_-_108px)] w-full overflow-y-auto bg-white sm:min-h-[calc(100%_-_144px)]'
                 }
             >
-                <div className={Styles[`container`]}>
+                <div className="mx-auto h-full min-h-full w-[90%] max-w-[1236px] text-[#0f1f39]">
                     <Outlet />
                 </div>
             </div>