diff --git a/src/app/components/access/access.component.html b/src/app/components/access/access.component.html
index ebc8ef7..e6e868c 100644
--- a/src/app/components/access/access.component.html
+++ b/src/app/components/access/access.component.html
@@ -3,7 +3,7 @@
         <div class="col-12 mt-5 xl:mt-0 text-center">
             <img src="assets/layout/images/logo-orange.svg" alt="Sakai logo" class="mb-5" style="width:81px; height:60px;">
         </div>
-        <div class="col-12 xl:col-5" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(247, 149, 48, 0.4) 10%, rgba(247, 149, 48, 0) 30%);">
+        <div class="col-12 xl:col-6" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(247, 149, 48, 0.4) 10%, rgba(247, 149, 48, 0) 30%);">
             <div class="surface-card h-full w-full m-0 py-7 px-4" style="border-radius:53px;">
                 <div class="grid flex flex-column align-items-center">
                     <div class="flex justify-content-center align-items-center bg-orange-500 border-circle" style="width:3.2rem; height:3.2rem;">
diff --git a/src/app/components/error/error.component.html b/src/app/components/error/error.component.html
index b4ee0e4..1a061cf 100644
--- a/src/app/components/error/error.component.html
+++ b/src/app/components/error/error.component.html
@@ -3,7 +3,7 @@
         <div class="col-12 mt-5 xl:mt-0 text-center">
             <img src="assets/layout/images/logo-error.svg" alt="Sakai logo" class="mb-5" style="width:81px; height:60px;">
         </div>
-        <div class="col-12 xl:col-5" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(233, 30, 99, 0.4) 10%, rgba(33, 150, 243, 0) 30%);">
+        <div class="col-12 xl:col-6" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(233, 30, 99, 0.4) 10%, rgba(33, 150, 243, 0) 30%);">
             <div class="surface-card h-full w-full m-0 py-7 px-4" style="border-radius:53px;">
                 <div class="grid flex flex-column align-items-center">
                     <div class="flex justify-content-center align-items-center bg-pink-500 border-circle" style="height:3.2rem; width:3.2rem;">
diff --git a/src/app/components/landing/landing.component.html b/src/app/components/landing/landing.component.html
index b2ebe0a..9c4d3d6 100644
--- a/src/app/components/landing/landing.component.html
+++ b/src/app/components/landing/landing.component.html
@@ -53,8 +53,8 @@
             </div>
 
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pr-5 lg:pb-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(253, 228, 165, 0.2),rgba(187, 199, 205, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2),rgba(187, 199, 205, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(253, 228, 165, 0.2),rgba(187, 199, 205, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2),rgba(187, 199, 205, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-yellow-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-users text-2xl text-yellow-700"></i>
                         </div>
@@ -65,8 +65,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pr-5 lg:pb-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145,226,237,0.2),rgba(251, 199, 145, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2), rgba(172, 180, 223, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145,226,237,0.2),rgba(251, 199, 145, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2), rgba(172, 180, 223, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-cyan-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-palette text-2xl text-cyan-700"></i>
                         </div>
@@ -77,8 +77,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pb-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145, 226, 237, 0.2), rgba(172, 180, 223, 0.2)), linear-gradient(180deg, rgba(172, 180, 223, 0.2), rgba(246, 158, 188, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145, 226, 237, 0.2), rgba(172, 180, 223, 0.2)), linear-gradient(180deg, rgba(172, 180, 223, 0.2), rgba(246, 158, 188, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-indigo-200" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-map text-2xl text-indigo-700"></i>
                         </div>
@@ -89,8 +89,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pr-5 lg:pb-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(187, 199, 205, 0.2),rgba(251, 199, 145, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2),rgba(145, 210, 204, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(187, 199, 205, 0.2),rgba(251, 199, 145, 0.2)), linear-gradient(180deg, rgba(253, 228, 165, 0.2),rgba(145, 210, 204, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-bluegray-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-id-card text-2xl text-bluegray-700"></i>
                         </div>
@@ -101,8 +101,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pr-5 lg:pb-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(187, 199, 205, 0.2),rgba(246, 158, 188, 0.2)), linear-gradient(180deg, rgba(145, 226, 237, 0.2),rgba(160, 210, 250, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(187, 199, 205, 0.2),rgba(246, 158, 188, 0.2)), linear-gradient(180deg, rgba(145, 226, 237, 0.2),rgba(160, 210, 250, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-orange-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-star text-2xl text-orange-700"></i>
                         </div>
@@ -113,8 +113,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pb-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(251, 199, 145, 0.2), rgba(246, 158, 188, 0.2)), linear-gradient(180deg, rgba(172, 180, 223, 0.2), rgba(212, 162, 221, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(251, 199, 145, 0.2), rgba(246, 158, 188, 0.2)), linear-gradient(180deg, rgba(172, 180, 223, 0.2), rgba(212, 162, 221, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-pink-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-moon text-2xl text-pink-700"></i>
                         </div>
@@ -125,8 +125,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pr-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145, 210, 204, 0.2), rgba(160, 210, 250, 0.2)), linear-gradient(180deg, rgba(187, 199, 205, 0.2), rgba(145, 210, 204, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145, 210, 204, 0.2), rgba(160, 210, 250, 0.2)), linear-gradient(180deg, rgba(187, 199, 205, 0.2), rgba(145, 210, 204, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-teal-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-shopping-cart text-2xl text-teal-700"></i>
                         </div>
@@ -137,8 +137,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg:pr-5 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145, 210, 204, 0.2), rgba(212, 162, 221, 0.2)), linear-gradient(180deg, rgba(251, 199, 145, 0.2), rgba(160, 210, 250, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(145, 210, 204, 0.2), rgba(212, 162, 221, 0.2)), linear-gradient(180deg, rgba(251, 199, 145, 0.2), rgba(160, 210, 250, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-blue-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-globe text-2xl text-blue-700"></i>
                         </div>
@@ -149,8 +149,8 @@
             </div>
     
             <div class="col-12 md:col-12 lg:col-4 p-0 lg-4 mt-4 lg:mt-0">
-                <div style="padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(160, 210, 250, 0.2), rgba(212, 162, 221, 0.2)), linear-gradient(180deg, rgba(246, 158, 188, 0.2), rgba(212, 162, 221, 0.2));">
-                    <div class="p-3 surface-card" style="border-radius:8px;">
+                <div style="height:160px; padding:2px; border-radius:10px; background: linear-gradient(90deg, rgba(160, 210, 250, 0.2), rgba(212, 162, 221, 0.2)), linear-gradient(180deg, rgba(246, 158, 188, 0.2), rgba(212, 162, 221, 0.2));">
+                    <div class="p-3 surface-card h-full" style="border-radius:8px;">
                         <div class="flex align-items-center justify-content-center bg-purple-200 mb-3" style="width:3.5rem;height:3.5rem; border-radius:10px;">
                             <i class="pi pi-fw pi-eye text-2xl text-purple-700"></i>
                         </div>
@@ -179,7 +179,7 @@
         </div>
 
         <div class="grid mt-8 pb-2 md:pb-8">
-            <div class="flex justify-content-center col-12 sm:col-6 bg-purple-100 p-0 flex-order-1 md:flex-order-0" style="border-radius:8px;">
+            <div class="flex justify-content-center col-12 lg:col-6 bg-purple-100 p-0 flex-order-1 md:flex-order-0" style="border-radius:8px;">
                 <img src="assets/layout/images/mockup.png" class="w-11" alt="mockup mobile">
             </div>
 
@@ -201,7 +201,7 @@
                 <span class="text-gray-700 text-2xl line-height-3 mr-0 md:mr-2" style="max-width:650px;">Adipiscing commodo elit at imperdiet dui. Viverra nibh cras pulvinar mattis nunc sed blandit libero. Suspendisse in est ante in. Mauris pharetra et ultrices neque ornare aenean euismod elementum nisi.</span>
             </div>
 
-            <div class="flex justify-content-end flex-order-1 sm:flex-order-2 col-12 sm:col-6 bg-yellow-100 p-0" style="border-radius:8px;">
+            <div class="flex justify-content-end flex-order-1 sm:flex-order-2 col-12 lg:col-6 bg-yellow-100 p-0" style="border-radius:8px;">
                 <img src="assets/layout/images/mockup-desktop.png" class="w-11" alt="mockup">
             </div>
         </div>
@@ -214,7 +214,7 @@
         </div>
 
        <div class="grid justify-content-between mt-8 md:mt-0">
-            <div class="col-12 md:col-6 lg:col-4 p-0 md:p-5">
+            <div class="col-12 lg:col-4 p-0 md:p-3">
                 <div class="p-3 flex flex-column border-200" style="border:2px solid; border-radius:10px;">
                     <h3 class="text-gray-900 text-center">Free</h3>
                     <img src="assets/layout/images/free.png" class="w-10 h-10 mx-auto" alt="">
@@ -245,7 +245,7 @@
                 </div>
             </div>
             
-            <div class="col-12 md:col-6 lg:col-4 p-0 md:p-5 mt-4 md:mt-0">
+            <div class="col-12 lg:col-4 p-0 md:p-3 mt-4 md:mt-0">
                 <div class="p-3 flex flex-column border-200" style="border:2px solid; border-radius:10px;">
                     <h3 class="text-gray-900 text-center">Startup</h3>
                     <img src="assets/layout/images/free.png" class="w-10 h-10 mx-auto" alt="">
@@ -276,7 +276,7 @@
                 </div>
             </div>
             
-            <div class="col-12 md:col-6 lg:col-4 p-0 md:p-5 mt-4 md:mt-0">
+            <div class="col-12 lg:col-4 p-0 md:p-3 mt-4 md:mt-0">
                 <div class="p-3 flex flex-column border-cyan-200" style="border:2px solid; border-radius:10px;">
                     <h3 class="text-gray-900 text-center">Free</h3>
                     <img src="assets/layout/images/free.png" class="w-10 h-10 mx-auto" alt="">
diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html
index d0a4e5f..24c5559 100644
--- a/src/app/components/login/login.component.html
+++ b/src/app/components/login/login.component.html
@@ -3,7 +3,7 @@
         <div class="col-12 mt-5 xl:mt-0 text-center">
             <img src="assets/layout/images/logo-blue.svg" alt="Sakai logo" class="mb-5" style="width:81px; height:60px;">
         </div>
-        <div class="col-12 xl:col-5" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(33, 150, 243, 0.4) 10%, rgba(33, 150, 243, 0) 30%);">
+        <div class="col-12 xl:col-6" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(33, 150, 243, 0.4) 10%, rgba(33, 150, 243, 0) 30%);">
             <div class="surface-card h-full w-full m-0 py-7 px-4" style="border-radius:53px;">
                 <div class="text-center mb-5">
                     <img src="assets/layout/images/avatar.png" alt="Image" height="50" class="mb-3">
diff --git a/src/app/components/notfound/notfound.component.html b/src/app/components/notfound/notfound.component.html
index a662bec..a5d359d 100644
--- a/src/app/components/notfound/notfound.component.html
+++ b/src/app/components/notfound/notfound.component.html
@@ -3,7 +3,7 @@
         <div class="col-12 mt-5 xl:mt-0 text-center">
             <img src="assets/layout/images/logo-blue.svg" alt="Sakai logo" class="mb-5" style="width:81px; height:60px;">
         </div>
-        <div class="col-12 xl:col-5" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(33, 150, 243, 0.4) 10%, rgba(33, 150, 243, 0) 30%);">
+        <div class="col-12 xl:col-6" style="border-radius:56px; padding:0.3rem; background: linear-gradient(180deg, rgba(33, 150, 243, 0.4) 10%, rgba(33, 150, 243, 0) 30%);">
             <div class="surface-card flex justify-content-center h-full w-full m-0 py-7 px-4" style="border-radius:53px;">
                 <div class="grid flex-column align-items-center">
                     <span class="text-blue-500 font-bold text-3xl">404</span>