/* Responsive styles for tablets */
@media (max-width: 834px) {
    /* Add your tablet-specific styles here */
    .mainCardContainer {
        position: relative;
    }

    .overlayImage {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }

    .mainCardContainerImage {
        position: relative;
        z-index: 2;
    }

    .mainCardContainerText {
        position: relative;
        z-index: 3;
    }
    .gradientOverlay{
        visibility: 0;
    }
    
    .contactContainer::before,
    .contactContainer::after {
        content: '';
        position: absolute;
        width: 25%;
        height: 1px;
        background-color: var(--ColorText);
    }

}

/* Responsive styles for mobile phones */
@media (max-width: 480px) {
    /* Add your mobile-specific styles here */
    body {
        font-size: 14px;
    }

    .container {
        width: 100%;
        padding: 0 10px;
    }

    header {
        justify-content: center;
    }

    .nav {
        display: flex;
        flex-direction: column;
    }

    .content {
        padding: 5px;
    }

    .mainCardContainer {
        position: relative;
        justify-content: center;
        align-items: center;
    }

    .overlayImage {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 1;
    }

    .mainCardContainerImage {
        position: relative;
        z-index: 2;

    }

    .mainCardContainerText {
        position: relative;
        z-index: 3;
    }
    .gradientOverlay{
        opacity: 0;
    }
    
    .contactContainer::before,
    .contactContainer::after {
        visibility: hidden;
    }

    .btnOverlayContainerLinks a {

        padding: 1.8rem;
        justify-content: center;
        align-items: center;
        display: flex;
        text-decoration: none;
        height: 2.5vh;
        width: 4vw;
    }
    
}