@media only screen and (min-width:1000px) {
    .loginFormContainer {
        width: 40%;
        margin: auto;
    }

    .formOuterMost {
        width: 80%;
        margin: auto;
    }

    .conversation {
        border: none;
        height: 70vh;
        width: 70vw;
    }
}

@media only screen and (max-width:999px) {
    .loginFormContainer {
        width: 90%;
        margin: auto;
    }

    .formOuterMost {
        width: 100%;
        margin: auto;
    }

    .conversation {
        border: none;
        height: 70vh;
        width: 90vw;
    }
}

html, body {
    /*height: 100%;
    width: 99%;
    margin: auto;*/
}

#divContent {
    padding-left: 5px;
    padding-right: 5px;
}

.mycheckBox {
    padding: 3px 5px 3px 13px;
    margin: 0;
}

    .mycheckBox label {
        font-weight: normal;
        margin: 1px 0 0 18px;
        padding: 0;
    }

    .mycheckBox tr td {
        border: none;
    }

.header {
}

.pagination {
    display: table-row !important;
    margin: 3px 0 !important;
}

    .pagination td {
        padding: 0 !important;
    }

        .pagination td table {
            margin: 5px;
        }

            .pagination td table tbody tr {
                line-height: unset;
            }

                .pagination td table tbody tr td {
                    padding: 0px !important;
                }

                    .pagination td table tbody tr td span {
                        text-decoration: none;
                        color: white;
                        padding: 4px 8px;
                        background-color: #0d87e9;
                    }

    .pagination a {
        padding: 4px 8px !important;
    }

        .pagination a:visited {
            text-decoration: none;
            background-color: #0d87e9;
        }

        .pagination a:hover {
            text-decoration: none;
        }

        .pagination a:active {
            text-decoration: none;
        }

.invisibleheader {
    visibility: hidden;
    width: 70px !important;
    font: bold;
}

.modal-body {
    max-height: 70vh;
    overflow-y: auto;
}

.list-group {
    margin: 5px !important;
}

    .list-group li {
        list-style: none;
        display: block;
        padding: 5px 10px;
    }

        .list-group li:hover {
            background-color: transparent;
        }

        .list-group li a:hover {
            text-decoration: none !important;
        }

table tr th {
    border: solid 1px #dddddd;
    text-align: center;
}

table tr td {
    border: solid 1px #dddddd;
}

.checkbox tr td {
    border: none;
}

.inlineFilter {
    padding: 5px;
    border-bottom: unset !important;
}

.MaxGridList tr th {
    white-space: nowrap;
}

.MaxGridList tr td {
    white-space: nowrap;
}

.gridAction {
    top: inherit !important;
    margin-top: 5px;
    left: inherit !important;
    position: inherit;
}

.GridActionCol:not(th) {
    /* th is excluded because setting it to block stops it being a fixed header */
    width: 70px !important;
    /*display: block;*/
    text-align: left!important;
}

.GridActionCol .list-group li {
    text-align: left;
}

.dropdown-toggle-iimswiss option {
    background-color: #ffffff;
    color: black;
    font-weight: bolder;
}
/*****************Calendar Style Block*********************/
.calander {
    clear: both;
    background-color: whitesmoke;
    border: 1px solid;
    line-height: 30px;
}

    .calander table tr td {
        padding: 5px;
    }

        .calander table tr td:hover {
            background-color: rgb(200, 255, 0);
        }

.ajax__calendar_today {
    background-color: rgb(209, 233, 255) !important;
    border-radius: 3px;
}

.ajax__calendar_footer {
    background-color: rgb(209, 233, 255) !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    height: auto !important;
    margin-top: 18px !important;
}

.ajax__calendar_active {
    background-color: rgb(200, 255, 0) !important;
    border-radius: 3px;
}

.ajax__calendar_day {
    height: 20px !important;
    width: 20px !important;
    padding: 0;
    text-align: center;
    margin-top: -8px;
    margin-left: -5px;
}

.ajax__calendar_body {
    width: 190px !important;
    margin-top: 5px !important;
    /*height: 190px !important;*/
}

.ajax__calendar_container {
    width: auto !important;
}

.ajax__calendar_month {
    height: 32px !important;
    width: 34px !important;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}

    .ajax__calendar_month br {
        line-height: normal;
        display: none;
    }

.ajax__calendar_year {
    height: 32px !important;
    width: 34px !important;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
}

    .ajax__calendar_year br {
        line-height: normal;
        display: none;
    }
/****************Calendar Style End Block******************/

/********** following block is for loader *****************/
.glyphicon-refresh-animate {
    -animation: spin .7s infinite linear;
    -webkit-animation: spin2 .7s infinite linear;
}

@-webkit-keyframes spin2 {
    from {
        -webkit-transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: scale(1) rotate(0deg);
    }

    to {
        transform: scale(1) rotate(360deg);
    }
}

.breadcrumb {
    padding: 0px;
    background: transparent;
    list-style: none;
    overflow: hidden;
    margin-top: 20px;
    margin-bottom: 20px;
    border-radius: 4px;
    border: 1px solid white !important;
}

    .breadcrumb > li {
        display: table-cell;
        vertical-align: top;
        width: 1%;
    }

        .breadcrumb > li + li:before {
            padding: 0;
        }

    .breadcrumb li a {
        color: white;
        text-decoration: none;
        padding: 10px 0 10px 45px;
        position: relative;
        display: inline-block;
        width: calc( 100% - 15px );
        background-color: hsla(0, 0%, 83%, 1);
        text-align: center;
        text-transform: capitalize;
    }

    .breadcrumb li.completed a {
        background: brown;
        background: hsla(153, 57%, 51%, 1);
    }

        .breadcrumb li.completed a:after {
            border-left: 30px solid hsla(153, 57%, 51%, 1);
        }

    .breadcrumb li.next a {
        background: brown;
        background: hsl(47, 94%, 49%);
    }

        .breadcrumb li.next a:after {
            border-left: 30px solid hsla(47, 94%, 49%,1);
        }

    .breadcrumb li.active a {
        background: brown;
        background: hsla(34, 92%, 58%,1);
    }

        .breadcrumb li.active a:after {
            border-left: 30px solid hsla(34, 92%, 58%,1);
        }

    .breadcrumb li:first-child a {
        padding-left: 15px;
    }

    .breadcrumb li:last-of-type a {
        width: calc( 100% - 38px );
    }

    .breadcrumb li a:before {
        content: " ";
        display: block;
        width: 0;
        height: 0;
        border-top: 50px solid transparent;
        border-bottom: 50px solid transparent;
        border-left: 30px solid white;
        position: absolute;
        top: 50%;
        margin-top: -50px;
        margin-left: 1px;
        left: 100%;
        z-index: 1;
    }

    .breadcrumb li a:after {
        content: " ";
        display: block;
        width: 0;
        height: 0;
        border-top: 50px solid transparent;
        border-bottom: 50px solid transparent;
        border-left: 30px solid hsla(0, 0%, 83%, 1);
        position: absolute;
        top: 50%;
        margin-top: -50px;
        left: 100%;
        z-index: 2;
    }
/********** End of loader block *****************/

.input-group {
    width: 100% !important;
}

.input-group-append > i {
    margin: 10px 0 0 10px !important;
}

.table-borderless {
    border: none;
}

.table-borderless > thead > tr > th,
.table-borderless > tbody > tr > th,
.table-borderless > tfoot > tr > th,
.table-borderless > thead > tr > td,
.table-borderless > tbody > tr > td,
.table-borderless > tfoot > tr > td {
    border: none;
}

[data-md], .dynamicLink {
    cursor: pointer;
}

    [data-md]:after, .dynamicLink:after {
        content: "\e89e";
        font-family: 'Material Symbols Outlined';
        position: absolute;
        color: red;
        cursor: pointer;
        margin-left: 4px;
        font-size: 12px;
        padding: 0px;
        line-height: 1.1;
    }


    [data-md]:hover, .dynamicLink:hover {
        color: red;
        text-decoration: underline;
    }

@media only screen and (max-width:1280px) and (min-width:935px) {
    nav .dropdown.displayUserName ul {
        right: 0px !important;
        left: auto !important;
    }
}
#divSFPageHeading {
    max-width: 400px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
input[type="checkbox"]:indeterminate:after {
    content: '─';
    text-align: center;
    color: #2196f3;
    border-color: #2196f3;
    font-size: xx-small;
    font-weight: bolder;
}

:root {
    --clrError: #dc3545;
    --clrWarning: #ffc107;
    --clrInfo: #17a2b8;
}

.rptReports{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
}

.report-item{
    padding: 8px;
}

.report-item a {
    color: rgb(102, 102, 102);
}


    .recentlyUsedReports {
        font-weight: 500;
    }

.recentlyUsedReports a {
    padding-right: 24px;
    display: block;
}

.noReportMessage {
    padding: 8px;
}

#reportsWrapper {
    display: flex;
    gap: 8px;
}

#recentlyUsedReportsContainer {
    border-right: 1px solid rgb(128, 128, 128);
}

.reportItemContainer{
    display: flex;
}



@media (max-width:1400px) {
    .rptReports {
        grid-template-columns: 1fr 1fr;
    }
}


@media (max-width:800px) {
    .rptReports{
        grid-template-columns: 1fr;
    }
    .reportsMenuContainer{
        width: 100vw;
    }

    #reportsWrapper {
        flex-direction: column;
    }

    .recentlyUsedReports {
        flex-direction: column;
        gap: 4px;
    }

    #recentlyUsedReportsContainer {
        border-bottom: 1px solid black;
        border-right: 0px;
    }
}