update

src/ts/components/Quiz/styles/answer.module.scss

@@ -133,7 +133,6 @@
 @media (max-width: 900px) {
   .quiz_answer {
     width: 100px;
-
     &_small {
       width: 68px;
     }
@@ -144,4 +143,7 @@
   .quiz_answer_wrapper_small .quiz_answer {
     width: 68px;
   }
+  .quiz_answer_wrapper + .quiz_answer_wrapper {
+    margin-left: var(--space-l);
+  }
 }

src/ts/components/Races/index.tsx

@@ -58,8 +58,10 @@ function Races({
           backgroundImage: 'url(./assets/games/races/greenTop.png)',
         }}
       />
-      <div className={style.races}>
-        {lines}
+      <div className={`${style.races} scroll_x`}>
+        <div style={{ minWidth: '900px' }}>
+          {lines}
+        </div>
       </div>
       <div
         className={style.races_green}

src/ts/components/Races/styles/index.module.scss

@@ -28,10 +28,6 @@
     background-repeat: repeat-x;
     background-size: auto 100%;
     background-position: top left;
-
-    &:first-child {
-      // border-top: var(--space-xxs) dashed var(--color-border);
-    }
   }
 
   &_button {

src/ts/components/Races/styles/info.module.scss

@@ -25,7 +25,6 @@
   animation-fill-mode: both;
 }
 
-
 @keyframes races_track_info {
   from {
     opacity: 0;
@@ -34,3 +33,9 @@
     opacity: 1;
   }
 }
+
+@media (max-width: 900px) {
+  .races_track_info {
+    margin: 0 12%;
+  }
+}

src/ts/components/SwimmingPool/index.tsx

@@ -38,7 +38,11 @@ function SwimmingPool({
           backgroundImage: 'url(./assets/games/swimmingPool/block2.png)',
         }}
       />
-      {lines}
+      <div className="scroll_x">
+        <div style={{ minWidth: '900px' }}>
+          {lines}
+        </div>
+      </div>
       <div
         className={style.swimming_pool_bottom_border}
         style={{

src/ts/components/SwimmingPool/styles/track.module.scss

@@ -62,5 +62,9 @@
       width: 71px;
       line-height: 64px;
     }
+
+    &_line {
+      width: calc(100% - 384px);
+    }
   }
 }