Fixed swiper style

src/components/Feed/ArticleCard/ArticleCard.module.scss

@@ -412,6 +412,8 @@
   }
 
   swiper-slide & {
+    margin-bottom: 0;
+
     @include media-breakpoint-down(lg) {
       aspect-ratio: 1/1;
     }
@@ -422,12 +424,8 @@
 
     @include media-breakpoint-down(sm) {
       aspect-ratio: 1/1;
-    }
-  }
 
-  &.swiper-slide {
       .shoutCardContent {
-      @include media-breakpoint-down(md) {
         padding-left: 10%;
       }
     }

src/components/_shared/SolidSwiper/ArticleCardSwiper.tsx

@@ -40,9 +40,9 @@ export const ArticleCardSwiper = (props: Props) => {
               thumbs-swiper={'.thumbSwiper'}
               observer={true}
               onSlideChange={handleSlideChange}
-              space-between={26}
+              space-between={20}
               breakpoints={{
-                576: { spaceBetween: 20, slidesPerView: 1 },
+                576: { spaceBetween: 20, slidesPerView: 1.5 },
                 992: { spaceBetween: 52, slidesPerView: 1.5 }
               }}
               loop={true}

src/components/_shared/SolidSwiper/Swiper.module.scss

@@ -39,7 +39,6 @@
 
     .container {
       margin: auto;
-
       // max-width: 800px;
       position: relative;
       padding: 24px 0;
@@ -127,10 +126,9 @@
     position: relative;
     box-sizing: border-box;
     overflow: hidden;
-    width: calc(100% - 130px);
 
-    @media only screen and (max-width: 576px) {
+    @include media-breakpoint-up(sm) {
-      width: 100%;
+      //width: calc(100% - 130px);
     }
 
     .counter {
@@ -173,7 +171,7 @@
     align-items: center;
     cursor: pointer;
     height: 100%;
-    width: 12.5%;
+    width: 10%;
     z-index: 2;
 
     &.disabled {