.elementor-86 .elementor-element.elementor-element-2e16934{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:40px;--padding-bottom:40px;--padding-left:40px;--padding-right:40px;}.elementor-86 .elementor-element.elementor-element-2e16934:not(.elementor-motion-effects-element-type-background), .elementor-86 .elementor-element.elementor-element-2e16934 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-3b49873 );}.elementor-86 .elementor-element.elementor-element-0b8415b{--display:flex;}.elementor-86 .elementor-element.elementor-element-fc9be46 > .elementor-widget-container{padding:20px 20px 20px 20px;}.elementor-86 .elementor-element.elementor-element-fc9be46{text-align:center;}.elementor-86 .elementor-element.elementor-element-fc9be46 .elementor-heading-title{font-weight:100;color:var( --e-global-color-primary );}/* Start custom CSS for shortcode, class: .elementor-element-f76a150 *//* Container for the grid */
.brand-thumbnails-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  justify-content: center; /* Optional: centers the grid items */
}

/* Each brand item */
.brand-thumbnails-grid .brand-item {
  width: calc(25% - 20px); /* Adjust to get 4 per row; modify as needed */
  box-sizing: border-box;
  position: relative; /* Ensures internal absolute positioning works */
}

/* The anchor wrapping the image */
.brand-thumbnails-grid .brand-item a {
  position: relative;
  display: block;
}

/* Ensure the image fits inside the anchor */
.brand-thumbnails-grid .brand-item a img {
  display: block;
  width: 100%;
}

/* Dark overlay covering the image */
.brand-thumbnails-grid .brand-item a::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(79, 14, 166, 0.45);
  z-index: 5;
}

/* Overlay text using the title attribute */
.brand-thumbnails-grid .brand-item a::after {
  content: attr(title);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(106, 213, 48, 0.90);
  padding: 5px 20px;
  color: #FFF;
  font-family: Luckiest Guy ;
  font-size: 18px;
  font-weight: thin;
  text-align: center;
  z-index: 10;
  white-space: nowrap;
  pointer-events: none; /* Makes sure clicks go to the link */
}/* End custom CSS */