diff --git a/src/App.jsx b/src/App.jsx
index 639647e..b4d8959 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -17,7 +17,7 @@ function App() {
     return (
         <>
             {!isLoaded && <LoadingScreen onComplete={() => setIsLoaded(true)} />}
-            <div className={`min-h-screen min-w-sc transition-opacity duration-700 ${isLoaded ? "opacity-100" : "opacity-0"} bg-black text-gray-100`}>
+            <div className={`min-h-screen max-w-sc transition-opacity duration-700 ${isLoaded ? "opacity-100" : "opacity-0"} bg-black text-gray-100`}>
                 <Navbar menuOpen={menuOpen} setMenuOpen={setMenuOpen} />
                 <MobileMenu menuOpen={menuOpen} setMenuOpen={setMenuOpen} />
                 <Home />
diff --git a/src/components/sections/About.jsx b/src/components/sections/About.jsx
index 7eb8d48..7265c0b 100644
--- a/src/components/sections/About.jsx
+++ b/src/components/sections/About.jsx
@@ -198,7 +198,7 @@ function About() {
                                     <span className="text-lg">Skills</span>
                                     <ul className="flex flex-wrap flex-row space-x-2 space-y-2 list-inside mx-5">
                                         {cybersecuritySkills.skils.map((value, key) => (
-                                            <li key={key} className="text-sm whitespace-nowrap bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59,130,246,0.2)] transition">{value}</li>
+                                            <li key={key} className="text-sm whitespace-normal bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59,130,246,0.2)] transition">{value}</li>
                                         ))}
                                     </ul>
                                     <span className="text-lg">Projects</span>
@@ -217,7 +217,7 @@ function About() {
                                     <span className="text-lg">Skills</span>
                                     <ul className="flex flex-wrap flex-row space-x-2 space-y-2 list-inside mx-5">
                                         {programmationSkills.skils.map((value, key) => (
-                                            <li key={key} className="text-sm whitespace-nowrap bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59,130,246,0.2)] transition">{value}</li>
+                                            <li key={key} className="text-sm whitespace-normal bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59,130,246,0.2)] transition">{value}</li>
                                         ))}
                                     </ul>
                                     <span className="text-lg">Projects</span>
@@ -236,7 +236,7 @@ function About() {
                                     <span className="text-lg">Skills</span>
                                     <ul className="flex flex-wrap flex-row space-x-2 space-y-2 list-inside mx-5">
                                         {networkSkills.skils.map((value, key) => (
-                                            <li key={key} className="text-sm my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
+                                            <li key={key} className="text-sm whitespace-normal my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
                                         ))}
                                     </ul>
                                     <span className="text-lg">Projects</span>
@@ -255,7 +255,7 @@ function About() {
                                     <span className="text-lg">Skills</span>
                                     <ul className="flex flex-wrap flex-row space-x-2 space-y-2 list-inside mx-5">
                                         {systemSkills.skils.map((value, key) => (
-                                            <li key={key} className="text-sm my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
+                                            <li key={key} className="text-sm whitespace-normal my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
                                         ))}
                                     </ul>
                                     <span className="text-lg">Projects</span>
@@ -274,7 +274,7 @@ function About() {
                                     <span className="text-lg">Skills</span>
                                     <ul className="flex flex-wrap flex-row space-x-2 space-y-2 list-inside mx-5">
                                         {projectManagementSkills.skils.map((value, key) => (
-                                            <li key={key} className="text-sm my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
+                                            <li key={key} className="text-sm  whitespace-normal my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
                                         ))}
                                     </ul>
                                     <span className="text-lg">Projects</span>
@@ -293,7 +293,7 @@ function About() {
                                     <span className="text-lg">Skills</span>
                                     <ul className="flex flex-wrap flex-row space-x-2 space-y-2 list-inside mx-5">
                                         {languageSkills.skils.map((value, key) => (
-                                            <li key={key} className="text-sm my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
+                                            <li key={key} className="text-sm =whitespace-normal my-1 bg-blue-500/10 text-blue-500 py-1 px-3 rounded-full hover:bg-blue-500/20 hover:shadow-[0_2px_8px_rgba(59, 130, 246, 0.2)] transition">{value}</li>
                                         ))}
                                     </ul>
                                     <span className="text-lg">Projects</span>