

.grey-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5); /* Semi-transparent grey */
    z-index: 1; /* Ensure overlay is below the text and button */
}

.tp-caption {
    z-index: 2; /* Text layer should be above the overlay */
}

.tp-caption.button-caption {
    z-index: 150; /* Ensure button is above both text and overlay */
}
.button-link {
    display: inline-block;
    padding: 10px 20px;
    background-color: #73C6CD; /* Button color */
    color: white; /* Text color */
    text-transform: uppercase;
    font-weight: bold;
    font-size: 16px;
    border-radius: 5px;
    text-decoration: none; /* No underline by default */
    position: relative;
    z-index: 4; /* Ensure button has the highest z-index */
    transition: background-color 0.3s ease, color 0.3s ease; /* Transition for background and color */
}


/* Change padding only on smaller devices */
@media (max-width: 768px) {
    .button-link {
        padding: 15px 20px; /* Increase top-bottom padding to 15px for smaller screens */
    }
}


.button-link:hover {
    background-color: #5aa5a8; /* Darker shade for hover effect */
    color: white; /* Keep text color white on hover */
    text-decoration: underline #73C6CD; /* Ensure no underline on hover */
}


.banner-highlight {color:#73C6CD}


.custom-page-header-curved-top-1 {
	    z-index:0; /* lower value */
    pointer-events: none;
}


