html, body, .container {
    height: 100%;
}

body {
    background-color: var(--body-background);
}

.container-card-body {
    padding: 0px !important;
}

@media (min-width: 767.99px) {
    .public-header {
        height: 150px;
    }
}

@media (max-width: 768px) {
    .public-header {
        height: 250px;
    }

    .k-step-label {
        display: none !important;
    }

    .page-heading {
        display: block !important;
    }

    .wizard-stepper-background {
        height: 80px;
        margin: -25px -30px -78px -30px;
    }
}

.public-header {
    background-color: var(--primary);
    padding-bottom: 40px;
}

.page-heading {
    margin: 0px 0px 8px 9px;
    display: none;
}

.public-content {
    height: 100%;
}

.public-footer {
    height: 40px;
    font-size: 11px;
    color: var(--gray-light);
}

.public-brand {
    width: 100%;
    text-align: center;
}

.public-brand-logo {
    height: 75px;
}

.h-job-app {
    color: var(--secondary);
    width: 100%;
    text-align: center;
}

.job-app-date {
    color: var(--secondary);
    font-size: 28px;
}

.job-app-time {
    color: var(--secondary);
}

.job-app-card {
    margin-top: -40px;
}

.job-app-copyrights {
    margin-left: -10px;
}

.job-app-terms {
    margin-right: -30px;
}

    .job-app-copyrights > a,
    .job-app-terms > a {
        text-decoration: none;
        color: inherit;
    }

        .job-app-copyrights > a:hover,
        .job-app-terms > a:hover {
            text-decoration: underline;
            color: var(--gray);
        }