diff --git a/src/components/Genres.tsx b/src/components/Genres.tsx
index 1dec7d9..67d2398 100644
--- a/src/components/Genres.tsx
+++ b/src/components/Genres.tsx
@@ -19,8 +19,8 @@ const Genres: React.FC<IGenresProps> = ({
   const { t } = useTranslate();
   return (
     <ul
-      className={`flex overflow-x-auto my-2 -mx-4 text-sm lg:mx-0 lg:overflow-auto lg:flex-wrap lg:justify-start select-none ${
-        onClick ? 'flex-wrap' : ''
+      className={`flex overflow-x-auto my-2 -mx-4 text-sm lg:mx-0 lg:overflow-auto lg:flex-wrap lg:justify-start select-none gap-y-1 ${
+        onClick ? 'flex-wrap justify-evenly' : ''
       }`}
       style={{ WebkitOverflowScrolling: 'touch' }}
     >
@@ -29,7 +29,7 @@ const Genres: React.FC<IGenresProps> = ({
           <li
             key={g}
             {...(onClick ? { onClick: () => onClick(g) } : {})}
-            className={onClick ? 'cursor-pointer mb-1' : ''}
+            className={onClick ? 'cursor-pointer' : ''}
           >
             <div
               className={`bg-gray-100 px-2 py-1 rounded-full mx-1 whitespace-pre font-family-text ${