#welcome-card {
    background-position-y: 50%;
}

#info-cards {
    order: 6;
}

#info-cards > div {
    border-radius: 0;
    width: 100%;
}

#current-tenders-container {
    margin-top: 2rem;
}

.card .card-header a {
    text-decoration: none;
}

#content h1 {
    font-size: 2.5rem
}
#info-cards h5 {
    font-size: 1.25rem;
}

:root {
    --vw-actual: calc(100vw - var(--scrollbar-width));
}

#welcome-card {
    max-width: var(--vw-actual);
    width: var(--vw-actual);
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: calc(var(--vw-actual)/2 * -1);
    margin-right: calc(var(--vw-actual)/2 * -1);
}

@media (min-width: 576px) {
    #welcome-card {
        height: 585px;
        background-image: url("../../../../images/sa/banner_cropped.jpg");
        background-size: cover;
        background-repeat: no-repeat;;
    }

    #welcome-card > div {
        background: linear-gradient(to right, var(--theme-primary) 40%, transparent 60%, transparent);
    }

    #welcome-card h1 {
        width: 25%;
        color: white;
    }

    #info-cards {
        order: unset;
    }
    #info-cards > div {
        margin-top: 0;
    }
    #info-cards > div:first-child {
        border-bottom-left-radius:var(--bs-card-border-radius);
    }

    #current-tenders-container {
        margin-top: 0;
        max-width: calc(var(--vw-actual) / 2);
        width: calc(var(--vw-actual) / 2);
        position: relative;
        left: 50%;
        margin-left: -50%
    }
}

@media (min-width: 992px) {
    #welcome-card h1 {
        margin-left: calc((100% - var(--theme-container-width)) /2);
    }
}