/* CSS Document */


.table-wide {
  max-width:100%;
}



/*
 
 */

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.fw-normal {
  font-weight: 400!important;
}

[id^="prod"] {
  margin:3rem auto;
  padding: 6rem 0 1rem;
  scroll-margin-top: 5.4rem;
}
[id^="prod1"] {
  background-color: var(--prod-bg-color000);
}
[id^="prod2"] {
  background-color: var(--prod-bg-color000);
}
[id^="prod3"] {
  background-color: var(--prod-bg-color000);
}
[id^="prod4"] {
  background-color: var(--prod-bg-color000);
}

.icon-png {
  max-height: 5rem; max-width: 5rem;
}

.block-header {
  overflow: hidden;
}
.block-title:before {
  content: "";
  position: absolute; width: .3rem; height: 7rem;
  background-color: #C423A0;
  margin: .5rem 0 0 -.8rem;
}



.colorchip {
  position: relative; display: inline-block; width: 12rem;
  overflow: visible; margin-bottom: 0.3rem;
}
.colorchip-text {
  position: absolute; bottom: -5%; left: 50%; 
  transform: translate(-50%, -50%); 
  color: White; padding: .2rem 1rem; text-align: center;
  background-color: rgba(0, 0, 0, .5);
}
.colorchip img {
  transition: transform .5s ease;
  border-radius: 0rem !important;
}
.colorchip:hover img {
  transform: scale(1.8);
}
.colorchip:hover {
  filter: drop-shadow(0 0 10px rgba(0,0,0,.3));
  z-index: 1000;
}
@media (max-width: 767px) {
.colorchip {
  width: 9rem;
}
.colorchip-text {
  font-size: .8rem;
}
.colorchip:hover img {
  transform: scale(1.4);
}
}


.img-hover-zoom--basic img {
  transition: transform .5s ease;
  border-radius: 0rem !important;
}
.img-hover-zoom--basic:hover img {
  transform: scale(1.15);
}
.img-hover-zoom:not(.img-hover-zoom--empty):hover {
  filter: drop-shadow(0 0 10px rgba(0,0,0,.3));
}
.img-hover-zoom {
  overflow: hidden;
  border-radius: 0rem;
}