.equal-height-row {
    display: flex;
    flex-wrap: wrap;
    /* Allows columns to wrap to the next line if needed */
}

/* Specify which columns should have equal heights within the row */
.equal-height-row .equal-height-col {
    display: flex;
    flex-direction: column;
}

/* Container for the image */
.image-zoom {
    overflow: hidden;
    position: relative;
}

/* Apply the zoom effect to the image on hover */
.image-zoom img {
    width: 100%;
    height: auto;
    transition: transform 0.3s;
}

.image-zoom:hover img {
    transform: scale(1.2);
    /* Zoom in by 20% on hover */
}

.image-zoom:active img {
    transform: scale(1.2);
    /* Zoom in by 20% on tap */
}

.text-inside-image {
    font-size: 1rem;
    position: absolute;
    top: 25%;
    /* Center vertically */
    left: 50%;
    transform: translate(-50%, -50%);
    /* Center both horizontally and vertically */
    background: rgba(0, 0, 0, 0.4);
    color: white;
    padding: 5px 10px;
    /* Adjust the padding as needed */
    border-radius: 5px;
    white-space: nowrap;
    border-radius: 0;
}

.btn-inside-image {
    font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.3);
    color: white;
    border: none;
    border-radius: 5px;
    letter-spacing: 0;
    /* Set the initial letter spacing */
    border-radius: 0;
    background-color: #f16821;


}

.btn-inside-image:hover {

    font-family: "Poppins", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.3);
    border: none;
    border-radius: 5px;
    transition: color 0.9s;
    transition: 0.6s;
    border-radius: 0;
    letter-spacing: 1px;
}

.btn-inside-image:not(:hover) {
    letter-spacing: 0;
    transition: 0.9s;
    /* Reset letter spacing when not hovering */

}

@media (max-width: 768px) {

    .text-inside-image,
    .btn-inside-image {
        opacity: 1;
        /* Show the text and button on mobile */
    }
}

@media (max-width: 280px) {

    .text-inside-image {
        font-size: 10px;

    }

    .btn-inside-image {

        font-size: 10px;
        bottom: 15%;

    }

    .btn-inside-image:hover {
        font-size: 11px;
        bottom: 15%;
        transition: color 0.3s;
        transition: 0.3s;
    }

    .btn-inside-image:not(:hover) {
        letter-spacing: 0;
        transition: 0.4s;
        /* Reset letter spacing when not hovering */

    }
}