sponsor carousel fix for mobile

Author: s506gh

assets/img/Carousel/sponsorsmobile.png

@@ -218,15 +218,35 @@ body {
   background-color: #090909;
   border-radius: 25px;
   margin-left: 100px; margin-right: 100px;
+  
+}
+
+.onmobile {
+  display: none !important;
 }
+@media screen and (max-width:770px) {
 .carousel {
-  height: 30%;
+  height: 700px;
   background-image: linear-gradient(180deg, black, #00000000);
 }
 .carousel-inner {
-  height: 30%;
+  height: 700px;
+}
+.carousel-item { img {
+  height: 700px;
+  width: 100%;
+}}
+.carousel-item source {
+  height: 700px;
+}
+.nonmobile {
+  display: none !important;
+}
+.onmobile {
+  display: block !important;
+  background-color: #24263b;
+}
 }
-
 .crevomark {
   width: 35%;
   margin-left: 50%; margin-right: 50%;

css/index.css

@@ -66,8 +66,9 @@
         <div class="carousel-item">
           <img src="assets/img/Carousel/TeamPic2.jpg" style="object-fit: cover" class="d-block w-100 indexcar" alt="Crev Team Image" loading="lazy">
         </div>
-        <div class="carousel-item nonmobile">
+        <div class="carousel-item">
           <img src="assets/img/Carousel/sponsors.png" style="object-fit: cover" class="d-block w-100 indexcar nonmobile" alt="Crev Team Image" loading="lazy">
+          <img src="assets/img/Carousel/sponsorsmobile.png" style="object-fit: scale-down" class="d-block w-100 indexcar onmobile" alt="Crev Team Image" loading="lazy">
         </div>
       </div>
       <img class="crevomark position-absolute bottom-0 translate-middle" src="assets/img/Crevomark.svg">