diff --git a/client/src/components/Badges.jsx b/client/src/components/Badges.jsx
index c63f077..b602bed 100644
--- a/client/src/components/Badges.jsx
+++ b/client/src/components/Badges.jsx
@@ -31,13 +31,13 @@ export default function Badges({ badges: { obtained, unobtained } }) {
     return (
         <>
             <Grid container spacing={{ xs: 2, md: 3 }} columns={{ xs: 4, sm: 8, md: 12 }}>
-                <Grid item xs={2} sm={4} md={4}>
+                <Grid item xs={4} sm={8} md={12}>
                     <Typography variant='h5'>Obtained Badges</Typography>
                 </Grid>
                 {badgesGrid(obtained)}
             </Grid>
             <Grid container spacing={{ xs: 2, md: 3 }} columns={{ xs: 4, sm: 8, md: 12 }}>
-                <Grid item xs={2} sm={4} md={4}>
+                <Grid item xs={4} sm={8} md={12}>
                     <Typography variant='h5'>Unobtained Badges</Typography>
                 </Grid>
                 {badgesGrid(unobtained)}