.bi-tyre {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: url("img/Tyre.svg");
    mask-image: url("img/Tyre.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

.bi-rim {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: url("img/Rim.svg");
    mask-image: url("img/Rim.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

.bi-oil {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: url("img/Oil.svg");
    mask-image: url("img/Oil.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}

.bi-battery {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    -webkit-mask-image: url("img/Battery.svg");
    mask-image: url("img/Battery.svg");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    mask-size: contain;
    mask-position: center;
}
.custom-slider-banner {
  width: 100%;
  position: relative;
}

.custom-slider-banner img {
  width: 100%;
  display: block;
}

.banner-desktop {
  width: 100%;
  height: auto;
}

.banner-mobile {
  display: none !important;
  width: 100%;
  height: auto;
}

@media (max-width: 768px) {
  .banner-desktop {
    display: none !important;
  }

  .banner-mobile {
    display: block !important;
    width: 100%;
    height: auto;
  }
}