diff --git a/src/components/JobOfferContent.jsx b/src/components/JobOfferContent.jsx
index 433cc2f..6aa8b01 100644
--- a/src/components/JobOfferContent.jsx
+++ b/src/components/JobOfferContent.jsx
@@ -47,7 +47,7 @@ const JobOfferContent = ({ id, skills }) => {
       {jobOffer && (
         <>
           <h1 className="my-4 mx-6 text-3xl font-bold text-slate-800">{jobOffer.name} w {jobOffer.company_name}</h1>
-          <div className="grid grid-cols-2 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3  gap-4">
+          <div className="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-2 lg:grid-cols-3 gap-2 sm:gap-4">
             {jobOffer.skill_levels.map((skillLevel) => {
               const skill = skills.find((s) => s.id === parseInt(skillLevel.skill_id));
               return skill ? (