@import url('https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

.e106_section_header {
    font-size: 24px;
  color: #FFFFFF !important;
  text-align: center;
  background-color: #0066CC;
  border-bottom: 5px solid #1DAEEC;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 5px;
  padding-bottom: 5px;
}
.ab {
    border: 1px solid #000000;
}
.sponsors-grid {
    display: grid;
    /* This is the key line: it creates a flexible number of columns */
    /* Each column is a minimum of 150px and an even fraction of the remaining space */
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 30px; /* Space between the images */
    align-items: center; /* Vertically center the logos */
    justify-items: center; /* Horizontally center the logos */
}
.sponsor-logo {
    max-width: 100%;
    height: auto;
}

    .sponsor-logo img {
        max-width: 100%;
        height: auto; /* Maintain aspect ratio */
        /*filter: grayscale(100%);*/ /* Optional: make logos monochrome */
        /*transition: filter 0.3s ease;*/
    }

    /* Interactive hover effects */
    /*.sponsor-logo:hover {
        transform: scale(1.1);*/ /* Zoom in slightly on hover */
    /*}

        .sponsor-logo:hover img {
            filter: grayscale(0%);*/ /* Restore color on hover */
        /*}*/
@media screen and (max-width:1999px) {
    .e106_section_header {
        font-size: 38px;
    }
}

@media screen and (max-width: 991px) {
    .e106_section_header {
        font-size: 28px;
    }
}
@media screen and (max-width: 767px) {

    .e106_section_header {
        text-align: center;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}