@media (min-width: 768px) {
    
#main {
  padding: 10px 50px 40px 50px;
  min-height: calc(100vh - 174px);
}

.woocommerce div.product div.images .flex-control-thumbs {
  width: 39%;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: min-content;
  grid-auto-rows: min-content;
  grid-gap: 4px;
  overflow-y: auto;
  padding-right: 10px;
}
    
}



#main {
  background-color: #f4f2ef;
  box-sizing: border-box;
}

body.single-product div.product {
  flex-direction: column;
}

.woocommerce-page div.product div.summary {
  width: 100%;
}

.woocommerce div.product div.images.woocommerce-product-gallery {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
}

.woocommerce div.product .flex-viewport {
  width: 59%;
}



/* Estilos da barra de rolagem para navegadores WebKit */

ol.flex-control-thumbs::-webkit-scrollbar {
  width: 10px;
  background-color: #a99da0;
  border: 4px solid #f4f2ef;
}

ol.flex-control-thumbs::-webkit-scrollbar-thumb {
  background-color: #e3bd1a;
  border-radius: 6px;
  /* border: 2px solid #f4f2ef; */
}

.woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(4n + 1) {
  clear: none;
}

/*
.woocommerce div.product .woocommerce-product-gallery--columns-4 .flex-control-thumbs li:nth-child(3n+1) {
    clear: left;
}*/

.woocommerce div.product div.images .flex-control-thumbs li {
  /* margin: 0.5%; */
  width: auto;
  float: none;
}

@media (max-width: 767px) {
  #main {
    padding: 10px 15px 5px 15px;
  }

  .woocommerce div.product .flex-viewport {
    width: 100%;
  }

  .woocommerce div.product div.images.woocommerce-product-gallery {
    flex-direction: column;
  }

  .woocommerce div.product div.images .flex-control-thumbs {
    width: 100%;
    order: initial;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: min-content;
    grid-auto-rows: min-content;
    grid-gap: 4px;
    margin: 8px 0 0 0;
  }
  
  .textura-rolagem {
    padding-right: 60px !important;
    background: url('http://edu.vanguarte.com.br/wp-content/uploads/2024/01/textura-rolagem-3.png') repeat-y;
    background-position: right 4px top;
  }

  .woocommerce div.product div.images .flex-control-thumbs li {
    width: unset;
    margin: unset;
  }
}