﻿.custom-datapager {
    padding: 0.5em 0;
    width: 100%;
    display: flex;
    justify-content: center;
    color: #c9001f;
}


.custom-back-button {
    height: 50px;
    width: 111%;
    margin: 32px auto 20px auto;
    padding: 16px;
    font-family: 'Open Sans', 'Font Awesome 6 Pro';
    font-size: 14px;
    font-weight: 700;
    line-height: 18px;
    text-decoration: none;
    color: #ffffff;
    background: #c9001f;
    border: 1px solid #a4a4a8;
    border-radius: 2px;
    --initialTextColor: #ffffff;
    --slideTextColor: #ffffff;
    --initialBgColor: #c9001f;
    --slideBgColor: #818181;
    color: var(--initialTextColor);
    background: linear-gradient(to left, var(--initialBgColor) 50%, var(--slideBgColor) 50%) right;
    background-size: 200%;
    transition: .5s ease-out;
}

.custom-back-button:hover {
    color: var(--slideTextColor);
    background-position: left;
}

tr.even {
    background: #f8f8f8;
}

tr.odd {
    background: #ffffff;
}

.JobDetailsLayout {
    width: 90% !important;
}


.tableForJobs {
    width: 100%;
    border-collapse: collapse;
}

    .tableForJobs th,
    .tableForJobs td {
        padding: 1em;
        text-align: center;
    }


@media only screen and (max-width: 767px) {
    .tableForJobs {
        display: block;
    }

        .tableForJobs thead {
            display: none;
        }

        .adminTable tr {
            display: block;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 1em;
            width: 30rem;
            border: solid 1px #d1d3d4;
        }

        .clientTable tr {
            display: block;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 1em;
            width: 36rem;
            border: solid 1px #d1d3d4;
        }

        .tableForJobs td {
            display: block;
            text-align: right;
            padding: 1em;
            position: relative;
        }

            .tableForJobs td::before {
                content: attr(data-title);
                font-weight: bold;
                text-align: left;
                position: absolute;
                left: 0;
                top: 1em;
                padding-left: 1em;
            }

            .tableForJobs td:last-child .unnamed-character-style-29 {
                width: 100%;
            }

    .viewButton {
        width: 50% !important;
    }

   /* .custom-back-button {
        margin-left: 1.5rem;
    }*/

    .logoImg {
        margin-right: 3rem;
    }
}

@media only screen and (max-width: 650px) {

    .clientTable tr {
        width: 30rem;
    }
}

@media only screen and (max-width: 625px) {

    .adminTable tr {
        width: 25rem;
    }
}

@media only screen and (max-width: 495px) {

    .clientTable tr {
        width: 25rem;
    }
}