challenge-vtex-io-ana-carolina-duarte-cavalcante/styles/css/vtex.store-components.css

/*
0 - 600PX: Phone
600 - 900px: Table portrait
900 - 1200px: Tablet landscape
[1200 - 1800] is where our nortal styles apply
1800px + : Big desktop
*/
/* Media Query M3 */
/* Grid breakpoints */
.container {
  width: 100%;
  padding: 0;
  margin: auto;
}
@media (max-width: 1920px) and (min-width: 1024px) {
  .container {
    padding: 0 40px;
  }
}

.carouselGaleryThumbs {
  margin-top: 16px;
}
.carouselGaleryThumbs .productImagesThumb {
  width: 10% !important;
  height: 10% !important;
  margin-right: 16px;
  width: 90px !important;
  height: 90px !important;
}
.carouselGaleryThumbs .productImagesThumb .figure,
.carouselGaleryThumbs .productImagesThumb .thumbImg {
  width: 100%;
  height: 100%;
  border-radius: 8px;
}

.carouselGaleryCursor {
  margin: 0 !important;
  width: auto;
  padding: 0;
}

.swiperCaret {
  display: none;
}

@media (max-width: 1920px) and (min-width: 1024px) {
  .productImagesGallerySwiperContainer {
    width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
}

.productImageTag--main {
  object-fit: unset !important;
}
@media (max-width: 1920px) and (min-width: 1024px) {
  .productImageTag--main {
    max-height: 664px !important;
    height: 664px !important;
  }
}

@media (max-width: 1920px) and (min-width: 1024px) {
  .productVideo,
  .videoContainer {
    height: 664px;
  }
}