body {
    background-color: #eff3f6;
    font-family: 'Roboto', sans-serif !important;
    font-size: 15px;
}

html, body {
    height: 100%;
    min-height: 100%;
}
/** For Fonts **/

@font-face {
    font-family: 'ProximaNova-Regular';
    src: url('../fonts/proxima_nova_font-webfont.woff2') format('woff2'), url('../fonts/proxima_nova_font-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

.container {
    max-width: 90%;
}

.btn-group-vertical > .btn,
.btn-group > .btn {
    position: relative;
    float: right;
}

.nav-outer .navbar {
    padding-bottom: 0;
    margin-bottom: 0;
}

.nav-outer {
    background: #407ec9;
    color: #fff;
}

.tab-outer {
    display: flex;
    justify-content: space-between;
    list-style: none;
    margin: 0;
    padding: 0;
}

.navbar1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.navbar-brand {
    color: #fff !important;
    font-size: 28px;
    padding-left: 0;
}

.page-head {
    padding: 10px;
    text-align: center;
    font-weight: bold;
    background: #fff;
    box-shadow: 2px 2px 3px #ccc;
    margin-bottom: 6px;
}

.glyphicon {
    color: #fff;
    font-size: 20px;
}

.nav > li > a:focus,
.nav > li > a:hover {
    text-decoration: none;
    background-color: #bebebe7d;
}

.navbar-right li:last-child {
    border-left: 1px solid #ccccccc7;
}

.card-body {
    background: #fff;
    padding: 10px;
    box-shadow: 0 .1rem 1rem rgba(0, 0, 0, .15) !important;
}

.row1 .card-body {
    background: #fff;
    padding: 12px;
    border-radius: 12px;
}

.card {
    border-radius: 12px !important;
    margin-bottom: 10px;
}

.mb-20 {
    margin-bottom: 20px;
}


.name {
    color: #fff;
}

.card-title {
    margin-top: 0;
    font-weight: bold;
    margin-bottom: 20px;
}

.kl-outer {
    display: flex;
    justify-content: space-between;
}

    .kl-outer .btn {
        border-radius: 0;
        display: flex;
        min-width: 18%;
        justify-content: space-between;
        align-items: baseline;
        padding: 14px;
        font-weight: bold;
    }

    .kl-outer .btn-primary {
        color: #000;
        background-color: #fff;
        border-color: #a5d0ff;
    }

    .kl-outer .btn .badge {
        position: relative;
        top: -1px;
        background: #4da1ff;
        color: #fff;
    }

.active .btn-info {
    color: #fff;
    background-color: #ff6400;
}

.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
    background-color: #FF5722;
    border-color: #337ab7;
}

.image {
    opacity: 1;
    display: block;
    width: 100%;
    height: auto;
    transition: .5s ease;
    backface-visibility: hidden;
}

.middle {
    transition: .5s ease;
    opacity: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
}

.container1:hover .image {
    opacity: 0.3;
}

.container1:hover .middle {
    opacity: 1;
}

.srch {
    background:var(--sea);
    color: #fff;
    max-width: 150px;
    height: 40px;
    line-height: 11px;
    border:none;
}

    .srch:hover, .srch:active {
        color: #fff;
        background: var(--sea);
    }
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle, .btn-primary.focus, .btn-primary:focus {
    color: #fff;
    background: var(--sea) !important;
    border-color: var(--sea);
}
.form-control {
    display: block;
    width: 68%;
    border-radius: 6px !important;
    min-height: 40px;
}

.input-daterange input {
    background-image: url(../Images/cal.jpg);
    background-repeat: no-repeat;
    background-size: 27px;
    background-position: right 5px;
    text-align: left !important;
}

tbody {
     background: #fff;
}

.table .thead-dark th {
    color: #fff;
    background-color: var(--sea);
    border-color: transparent;
    font-weight: 100;
}

table tr th:first-child {
    border-top-left-radius: 11px;
}

table tr th:last-child {
    border-top-right-radius: 11px;
}

a.badge-info:focus,
a.badge-info:hover {
    color: #fff !important;
    background-color: #8eb9ec !important;
}

.badge-info {
    color: #000;
    background-color: #cce3ff;
    font-weight: 100;
    padding: 9px 15px;
    font-size: 12px;
}

.outer-warpper1 {
    overflow-y: auto;
    height: calc(100vh - 146px);
}

.outer-warpper {
    height: calc(100vh - 180px);
    padding-bottom: 20px;
    overflow-y: auto;
}

.outer-warpper-certi {
    overflow-y: auto;
    height: calc(100vh - 122px);
}

.fbtm {
    display: block;
    position: absolute;
    left: 0;
    bottom: 0;
    height: auto;
    width: 100%;
    text-align: center;
    background: #fff;
    color: #9e9e9e;
    padding: 16px 11px;
    font-weight: 300;
    border-top: 1px solid rgba(0,0,0,.125);
}

.accordion .card-header {
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: var(--sea);
    border-top-left-radius: 6px !important;
    border-top-right-radius: 6px !important;
}

.accordion > .card {
    margin-bottom: 20px;
    border: transparent;
    background: transparent;
    overflow: inherit;
}

.accordion .card-body {
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}


.accordion .btn-link {
    font-weight: 500;
    color: #fff !important;
    text-decoration: none !important;
    text-align: left;
    width: 75%;
}

.card-header h2 {
    display: flex;
    justify-content: space-between;
}

.fa {
    background: var(--orange);
    color: #fff !important;
    min-width: 40px;
    min-height: 40px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 24px !important;
}

.lbl-head {
    margin-bottom: 0
}

.table td,
.table th {
    padding: .55rem;
    vertical-align: middle !important;
    border-top: 1px solid #dee2e6;
}

.rounded-circle {
    border-radius: 50% !important;
    position: absolute;
    background: #f04f6a;
    color: #fff;
    border: 2px solid #fff;
    font-size: 12px;
    width: 22px;
    top: -6px;
    right: -7px;
}

.fa-camera,
.fa-comments,
.fa-info-circle {
    color: var(--sea) !important;
    background: transparent !important;
    margin-top: 0px;
    font-size: 22px !important;
}

.fa-pencil-square-o {
    margin-top: 0;
}

table tr td.action {
    width: 120px;
    float: right
}

.fa-plus {
    background: #f04f6a;
    border: 2px solid #fff;
}

.fa-minus {
    border: 2px solid #fff;
}

.close {
    color: #fff;
    opacity: 1;
}

.modal-header {
    background: var(--sea);
    color: #fff;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    padding: 0.7rem 1rem;
}

.table .thead-blue th {
    color: #fff;
    background-color: var(--sea);
    border-color: transparent;
    font-weight: 500;
}

.fail {
    color: #fff !important;
    background-color: var(--sea) !important;
    font-size: 21px !important;
}
.table-info, .table-info > td, .table-info > th {
    background-color: var(--sea);
    color: #fff;
}
.dark {
    color: #fff;
    background-color: #3e3e3e;
    font-size: 21px;
}

.shadow {
    box-shadow: 0 .1rem 1rem rgba(0, 0, 0, .15) !important;
}

.pink {
    background: #ffb5c0;
}

.pink-light {
    background: #fcdce1;
}

.gray {
    background: #f8f8f8;
}

.fa.fa-cog {
    display: inline-block !important;
    font-size: 36px !important;
}

.dropdown-toggle::after {
    color: #fff;
}

.border-right {
    border-right: 2px solid #9e9e9e7a !important;
    color: #9E9E9E;
    font-weight: 100;
}

.toprow {
    font-size: 17px;
    font-weight: 500;
}

.fa.fa-mail-forward {
    background: var(--sea);
    color: #fff !important;
    width: 40px;
    height: 40px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 24px !important;
    margin-left: 10px;
    border-radius: 8px;
    cursor: pointer;
}

.dropdown-menu {
    left: -127px;
}

.back {
    height: 33px;
    width: 75px;
    line-height: 12px;
    margin-bottom: 10px;
}

.nav-link {
    display: block;
    height: 40px;
    padding: 11px;
    font-size: 15px;
    padding-left: 2px;
    text-align: center;
    padding-right: 2px;
}

.nav-pills .nav-link {
    color: #fff;
    background-color: var(--sea);
    border-color: #3e3e3e;
    border-radius: 6px 6px 0 0;
    margin-right: 7px;
    height: 46px;
}

    .nav-pills .nav-link.active,
    .nav-pills .show > .nav-link {
        color: #fff;
        background-color: var(--orange);
    }


button.close {
    background: red !important;
    width: 28px !important;
    height: 28px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: 2px solid !important;
    color: #fff !important;
    position: relative;
}

    button.close span {
        position: absolute;
        top: 0px;
        left: 6px;
    }

.modal-header .close {
    padding: 5px;
    margin: 0px
}

.fa.fa-bar-chart {
    background: transparent;
    color: #01a7c7 !important;
}

label {
    font-weight: 500;
}

#collapseOne .col-sm-2 {
    margin-bottom: 25px;
}

.comment {
    width: 100% !important;
    height: 60px;
    resize: none;
    max-width: 100% !important
}

.modal-content .card-header {
    padding: 1px 15px;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, .03);
    border-bottom: 1px solid rgba(0, 0, 0, .125);
    font-size: 16px;
}

.modal-content .fa {
    font-size: 27px !important;
    cursor: pointer
}

.modal-content .card-body {
    border-radius: 12px;
}

.one {
    min-width: 400px;
    width: 400px;
}

.table .fa {
    background: transparent;
    color: var(--sea) !important;
    cursor: pointer;
}

.tab-bg {
    padding: 10px;
    background: rgb(255, 255, 255);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
}

/*multi select*/
.ms-choice {
    height: 36px;
    line-height: 38px;
}

    .ms-choice > div {
        top: 6px;
    }

.ms-drop input[type="checkbox"] {
    margin-right: 10px;
}

.ms-parent {
    width: 100% !important;
}

#txtAreaCommentSave {
    width: 100% !important;
    height: 120px;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

#txtAreaCommentUpdate {
    width: 100% !important;
    max-width: 100% !important;
    height: 120px;
    border-top-left-radius: 0 !important;
    border-top-right-radius: 0 !important;
}

.comnt-head {
    font-weight: bold;
}

.cmnt-bar {
    background: var(--sea);
    padding: 2px 10px;
    color:#fff;
}

.table-active1 {
    background: rgba(0, 123, 255, .25);
    margin-top: 40px
}

/*pageing css*/
.paginate_button {
    width: 32px;
    background: #fff;
    float: left;
    text-align: center;
    border: 1px solid #ccc;
    padding: 4px;
    cursor: pointer
}

    .paginate_button.current {
        background:var(--sea);
        color: #fff;
    }

    .paginate_button.previous {
        width: 75px;
    }

    .paginate_button.next {
        width: 75px;
    }

.uname {
    color: #fff;
    font-weight: bold !important;
    font-size: 13px;
    margin-top: 6px;
}

.cntrl-prgm thead tr th:first-child,
.cntrl-prgm tr td:first-child {
    width: 50%
}

.lbl-box {
    background: #e9ecef;
    display: flex;
    padding: 10px;
    border-radius: 6px;
    min-height: 40px;
    white-space: normal;
    word-break: break-all;
}

.carousel-item {
    height: 100%;
    transition: transform 0.6s ease-in-out; /* Smoother transition */
    backface-visibility: hidden; /* Prevents flickering */
    perspective: 1000px; /* Helps rendering */
}

    .carousel-item img {
        width: 100%;
        height: auto;
        object-fit: cover;
        transition: none !important;
    }
.carousel-wraper {
    height: 100%
}

.carousel-caption {
    padding-top: 6px;
    padding-bottom: 20px;
    top: -6px;
    z-index: 9999;
    left: 21px;
}

    .carousel-caption h3 {
        color: #000;
        font-size: 14px;
        text-align: left
    }

.table-head {
    padding: 10px 0;
    font-size: 20px;
    font-weight: 500;
}

.no-shadow {
    box-shadow: none !important
}

table {
    border-collapse: collapse;
    width: 100%;
}

    table tr th {
        font-weight: 500 !important;
    }

.table-bordered td:first-child,
.table-bordered th:first-child {
    border-left: none !important
}

.blue-head tr th,
.blue-head tr td {
    border: 0;
    width: 10%;
}

    .blue-head tr th:first-child,
    .blue-head tr td:first-child {
        border: 0;
        width: 30% !important;
    }

    .blue-head tr th:nth-child(2),
    .blue-head tr td:nth-child(2) {
        border: 0;
        width: 30% !important;
    }

.fsr-form .col-md-2 {
    flex: 0 0 50.666667%;
    max-width: 20%;
}


.nav-item {
    width: 25%;
}

#loader-container {
    display: none
}

input[type=checkbox] {
    transform: scale(1.5);
}

b,
strong {
    font-weight: 500;
}

.list-group-flush.certi-history {
    max-height: 182px;
    overflow-y: scroll;
    border-radius: 0 0 12px 12px;
}

.img-wraper {
    min-height: 231px;
    border: 1px solid #ccc;
    padding: 7px;
    border-radius: 12px;
    margin-bottom: 10px;
}

.card-header:first-child {
    border-radius: 12px 12px 0 0;
}

.c-head {
    font-size: 17px;
    font-weight: 500;
}

.add-bar .fa {
    background: inherit;
    color: #fff !important;
    width: auto;
    height: auto;
    display: block;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: inherit;
}

.add-bar .btn-primary {
    color: #fff;
    background-color: var(--sea);
    border-color: var(--sea);
}

li {
    list-style-type: none;
}

.cust-bg b {
    font-weight: 500
}

.cust-bg li {
    min-width: 21%;
    margin-right: 8px;
    padding-right: 18px;
}

.list-group-flush {
    overflow-y: auto;
    height: auto;
    max-height: 465px;
}

#div-operator-certificate-view .list-group-flush:last-child .list-group-item:last-child {
    border-bottom: 0;
    border-radius: 0 0 12px 12px !important;
}

.attende {
    background: #f26323 !important;
    border: none;
    display: flex;
    font-size: 15px;
    border-radius: 6px;
    align-items: center;
    padding: 0px;
    padding-left: 10px;
}

.cust-bg {
    color: #000 !important
}

.collapseattende {
    width: 450px;
    position: absolute;
    right: 0px;
    top: 54px;
    color: #000;
    box-shadow: 1px -2px 8px 6px #b3b3b32e;
    z-index: 1000;
}

    .collapseattende .card-body {
        background: #fff;
    }

    .collapseattende .list-group-item.active {
        z-index: 2;
        color: #fff;
        background-color: var(--sea);
        border-color: var(--sea);
    }

.list-group-item.active {
    z-index: 2;
    color: #fff;
    background-color: var(--sea);
    border-color: var(--sea);
}

.msg-icon img {
    width: 36px;
    margin-left: 6px;
}

    .attende .fa-info-circle {
        width: auto;
        height: auto;
        display: inline-block;
        color: #fff !important;
        margin-left: 0px;
        background: transparent;
        font-size: 22px !important;
    }

.sign {
    width: 95%;
    border: 0px solid #ccc;
    overflow: visible;
    margin: 20px;
}

.attende-table tr th,
.attende-table tr td {
    height: auto !important;
    padding: 8px 13px;
}

.table-fixed thead {
    width: 97%;
}

.table-fixed tbody {
    max-height: 294px;
    overflow-y: auto;
    width: 100%;
}

.table-fixed thead,
.table-fixed tbody,
.table-fixed tr,
.table-fixed td,
.table-fixed th {
    display: block;
}

    .table-fixed tbody td,
    .table-fixed thead > tr > th {
        float: left;
        border-bottom-width: 0;
    }

.custom-control {
    padding-left: 0 !important;
    font-size: 14px !important;
}

.tbl-add-edit-operator .form-control {
    width: 90%;
}

.input-validation-error {
    border: 1px solid #dc3545 !important;
}

.hist-link {
    font-size: 13px
}

.error {
    border: 1px solid #dc3545 !important;
}

#ddlInovojecsVaccineMfg,
#ddlInovojecsName,
#ddlDayAgeVaccineMfg,
#ddlDayAgeName {
    max-width: 100%
}

.ui-hide-tag {
    display: none;
}

.pagination > li > a {
    cursor: pointer
}



    .pagination > li > a.active-page {
        z-index: 2;
        color: #fff !important;
        background-color: var(--sea);
        border-color: #ddd;
        cursor: pointer;
    }

.vct-wraper .form-control {
    width: 100% !important;
    max-width: 100% !important;
}

.modal-content {
    border: none
}

.btn-danger:not(:disabled):not(.disabled).active,
.btn-danger:not(:disabled):not(.disabled):active,
.show > .btn-danger.dropdown-toggle {
    color: #fff !important;
    background-color: #dc3545 !important;
    border-color: #dc3545 !important;
}

.attende-table .custom-control-label {
    margin-bottom: 0;
    margin-left: 21px;
    font-size: 14px;
}

.approved-bar {
    display: flex;
    justify-content: flex-end;
}

.mid-sec {
    max-height: 225px;
    display: inline-block;
}

#carouselExampleIndicators.carousel {
    position: relative;
}

#optcarouselExampleIndicators .carousel-control-prev {
    left: 0 !important;
}

#optcarouselExampleIndicators .carousel-control-next {
    right: 0 !important;
}

.sign-width {
    width: 90px
}

.tooltext {
    text-align: left;
    font-size: 19px;
    padding-left: 0px
}

    .tooltext li {
        font-size: 15px
    }

    .tooltext ul {
        padding-left: 14px
    }

.tooltip-inner {
    max-width: 900px;
    width: 500px
}

.tooltip {
    max-width: 697px;
    width: 513px;
    left: 200px;
}

@media (max-width: 1400px) {
    .container {
        max-width: 96% !important;
    }
}

@page {
    size: A4;
    margin: 0;
}

.fa-comments.vtc-comment {
    color: #f26323 !important;
}

.fa-comments.vtc-nocomment {
    color: #8080808f !important;
}

#loginModal .form-group {
    width: 89%;
    margin: 0 auto;
    margin-bottom: 11px;
}

#loginModal .form-control {
    display: block;
    max-width: 100%;
    border-radius: 6px !important;
    width: 100%;
}

#loginModal .modal-dialog {
    max-width: 430px !important;
}

#canSamModalBody textarea {
    margin-top: 0px;
    margin-bottom: 0px;
    height: 102px;
    resize: none;
    max-width: 100%;
    width: 100% !important;
}

.carousel-inner img {
    width: 80%;
    height: 100%;
    margin: 0 auto;
}
.carousel-inner {
    overflow: hidden; /* Ensures overflow doesn’t cause re-layout */
}

.toggle-handle {
    background: #fff !important;
}

.msg-icon {
    margin-left: 10px;
}

#operator-certificate b {
    font-weight: 600 !important
}

.cmnt {
    border: 1px solid #21252975;
    border-radius: 4px;
    padding: 17px;
}

.add-bar .fa-plus {
    font-size: 36px;
    cursor: pointer;
    background: #f04f6a;
    border: 2px solid #fff;
    box-shadow: none;
}

.add-bar .fa-minus {
    color: #fff !important;
    font-size: 36px;
    cursor: pointer;
    background: var(--sea);
    border: 2px solid #fff;
    box-shadow: none;
}

.list-group-item .form-check {
    position: relative;
    display: flex;
    padding-left: 1.25rem;
    justify-content: space-between;
}

.form-check-label {
    margin-bottom: 0;
    font-size: 14px;
}

.badge-pill {
    box-shadow: 0px 0px 15px 0px #00000073;
    height: 15px !important;
    width: 15px !important
}

.badge-yellow {
    color: #212529;
    background-color: #ffff04;
}

.btn-Download-oopt-certificate {
    max-width: 100%;
    width: 100%;
}

#tsize .btn-info {
    color: #fff;
}

#tsize .fa.fa-send {
    background: transparent !important;
    color: #fff !important;
    min-width: 20px !important;
    min-height: 20px !important;
    display: inline-block !important;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 16px !important;
}

.fa.fa-plus {
    background-image: url(../Images/plusicon.png);
    background-color: transparent;
    border: none;
    background-size: 34px;
    background-repeat: no-repeat;
    background-position: 1px 4px;
}

.fa.fa-minus {
    background-image: url('../Images/minusicon.png');
    background-color: transparent;
    border: none;
    background-size: 34px;
    background-repeat: no-repeat;
    background-position: 1px 4px;
}

.fa-minus:before,
.fa-plus:before {
    display: none
}

@media all and (-ms-high-contrast:none) {
    #pills-operator .ieclass {
        display: block !important;
        text-align: right !important;
    }

    #pills-operator .btn-opt-certi-search {
        margin-right: 20px !important;
    }

    #pills-safety .ieclass {
        display: block !important;
        text-align: right !important;
    }

    #pills-safety .btn-opt-certi-search {
        margin-right: 20px !important;
    }

    #pills-tabContent .attende {
        position: absolute;
        right: 10px;
        top: 8px
    }

        #pills-tabContent .attende .fa.fa-info-circle {
            position: relative;
            top: 8px;
        }

    .list-group-item {
        padding: 19px 10px
    }
}

.form-control:disabled,
.form-control[readonly] {
    background-color: #e9ecef;
    opacity: 1;
    white-space: nowrap;
    overflow: hidden
}

.close img {
    width: 30px !important
}

#EditOrderModal #OrderUpdateInfo_TrackingNo {
    max-width: 98% !important;
    width: 95% !important;
}

#EditOrderModal #OrderUpdateInfo_Comments {
    margin-top: 0px;
    margin-bottom: 0px;
    height: 82px;
    width: 100% !important;
    max-width: 97% !important;
    resize: none;
}

#EditOrderModal .form-control {
    width: 90% !important
}

.sign2 {
    width: 644px;
}

    .sign2 img {
        width: 100%;
        height: 100%;
        margin: 0 auto;
    }

#vendor .accordion .card-header {
    padding: .75rem 1.25rem;
    background-color: transparent !important;
    position: relative !important;
    color: #000 !important;
    margin-bottom: 2px;
    cursor: pointer;
    border-radius: 0px !important;
}

#vendor .mainhead {
    padding: .75rem 1.25rem;
    background-color: var(--sea);
    color: #fff;
    margin-bottom: 2px;
    border-radius: 12px;
}


#vendor .accordion .card-header:after {
    font-family: 'FontAwesome', Arial, sans-serif;
    content: "\f107";
    font-style: normal;
    float: right;
    position: absolute;
    top: 4px;
    right: 22px;
    font-size: 24px;
}

#vendor .accordion .card-header.collapsed:after {
    content: "\f105";
    position: absolute;
    top: 4px;
    right: 22px;
    font-size: 24px;
}

#vendor .accordion .card-body {
    padding: 10px 32px;
    box-shadow: none !important;
}


#mCSB_1_container {
    top: 0 !important;
}

.overlay1 {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0);
    z-index: 998;
    opacity: 0;
    transition: all 0.5s ease-in-out;
    top: 0 !important
}

.collapseattende .table-fixed tr {
    overflow: hidden
}

.notes-block {
    padding: 10px 10px 10px 0;
    display: block;
    font-weight: 100;
}
@media (forced-colors: active) {
    button {
        background-color: ButtonFace;
        color: ButtonText;
        border: 1px solid ButtonText;
    }
}

@media all and (-ms-high-contrast:none) {
    .someinput::-ms-clear {
        display: none;
    }

    #sidebarCollapse {
        position: relative;
        top: 0px;
        height: 20px !important
    }

    .card {
        display: block !important
    }
}

@media (max-width: 1400px) {
    .container {
        max-width: 96%;
    }
}

#frmOrderSearch .col-md-3 {
    flex: 0 0 25%;
    max-width: 16.6%;
}

.scrollable-menu {
    width: 430px;
    margin-top: 0;
    padding-top: 0;
    left: -208px !important;
}

    .scrollable-menu .list-group-item.active {
        z-index: 2;
        color: #fff;
        background-color: var(--sea);
        border-color: var(--sea);
    }

#ddlInovojecsDiluentMfg {
    min-width: 140px;
}

.inovo-prgrm-name {
    color: #fff;
    background:var(--sea);
    padding: 14px 10px;
    border-radius: 10px 10px 0 0;
}

.add-new-schedule-model select,
.add-new-schedule-model textarea {
    max-width: 100% !important;
    width: 100%
}

.max_width {
    max-width: 100% !important;
    width: 100%
}

.txt-Score {
    float: right
}

.tbl-Sanitation_Embrex .rounded-circle {
    top: -8px;
    right: 11px;
}

.tbl-Sanitation_Embrex tr th:nth-of-type(1),
.tbl-Sanitation_Embrex tr td:nth-of-type(1) {
    max-width: 100px;
    width: 200px;
}

.tbl-Sanitation_Embrex tr th:nth-of-type(2),
.tbl-Sanitation_Embrex tr td:nth-of-type(2) {
    width: 270px;
}

.tbl-Sanitation_Embrex tr th:nth-of-type(3),
.tbl-Sanitation_Embrex tr td:nth-of-type(3) {
    width: 290px;
}

.tbl-Sanitation_Embrex tr th:nth-of-type(4),
.tbl-Sanitation_Embrex tr td:nth-of-type(4) {
    width: 150px;
}

.tbl-Sanitation_Embrex tr th:nth-of-type(5),
.tbl-Sanitation_Embrex tr td:nth-of-type(5) {
    width: 150px;
}

.tbl-Sanitation_Embrex,
.form-control {
    width: 100%
}

.score-btn {
    background: #0f75bb;
    border-radius: 20px;
    color: #fff;
    padding: 4px 14px;
    margin-bottom: 10px;
}

.v_srch {
    margin-right: 90px
}

.cmt_input {
    max-width: 100% !important;
    width: 100% !important
}

.edit_chkbox {
    max-width: 85px;
    margin-right: 12px;
}

#TrainingSchedulesInfo_Comments {
    max-width: 100% !important
}

#txtAreaComments {
    white-space: normal !important
}

/*added css*/
#userDatatable_wrapper table {
    border-radius: 10px;
}

.Atxt {
    padding-right: 5px;
}

.lbl-box1 {
    overflow: hidden;
}

    .lbl-box1 .toggle.btn {
        height: 36px;
    }

/*responsive css start view assessment*/
@media screen and (min-width: 768px) and (max-width: 1180px) {

    .viewAssessment tbody tr td i.fa {
        min-width: 0;
        font-size: 18px !important;
    }

    .viewAssessment tbody tr td a {
        margin: 0;
    }

    .aprt {
        flex: 0 0 16.666667%;
        max-width: 45.666667%;
    }

    .bprt {
        max-width: 36.666667%;
    }

    .cprt {
        padding-right: 0;
    }

    .dprt {
        padding-right: 0;
    }

    #divDayofAgeSub table tr th,
    #divDayofAgeSub table tr td, #divSpray table tr th,
    #divSpray table tr td {
        font-size: 13px;
    }

    #tblInovoject tr th,
    #tblInovoject tr td {
        font-size: 13px;
    }

    .imgPlus {
        right: 6% !important;
    }

    .toggleBtn .toggle.btn.btn-primary,
    .toggleBtn .toggle.btn.btn-secondary.off {
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translate(-25%, -50%);
    }

    .badge-pill {
        margin-left: 25px;
        margin-top: 8px;
    }

    .modaltable table td,
    .modaltable table th {
        padding: 0.6em;
    }

    .lbl-box1 .toggle.btn {
        height: 36px !important;
    }
}

@media screen and (max-width: 767px) {
    .one {
        min-width: initial;
        width: initial;
    }
}

/*responsive css end view assessment*/


/***************************************************************css added by Monika start***************************************************************/
/****************************************************************css start***************************************************************/
button:focus {
    outline: none;
}

.font-weight-bold {
    font-weight: 500 !important;
}

.popup-alert-txt p {
    color: #000 !important;
    margin-bottom: 0px !important;
    line-height: 24px;
    text-align: center;
}

.popup-footer .btn {
    padding: 0px 27px !important;
    min-height: 33px !important;
    border-radius: 5px;
}

.popup-footer {
    padding: 4px !important;
    justify-content: center !important;
}

.delete-confirm-popup {
    box-shadow: 0px 0px 13px 6px rgb(0 0 0 / 10%) !important;
    max-width: 300px;
    margin: auto;
}

.delete-confirm-popup-outer {
    background: rgba(0, 0, 0, 0.5);
    max-width: 100%;
}

.popup-confirm-wo-attachment {
    max-width: 400px;
}

.dashboard-charts-card {
    background: #FFFFFF;
    border: 1px Solid #CAC7C7;
    border-radius: 10px;
    box-shadow: 0px 0px 6px rgb(240 245 245 / 80%);
    margin-bottom: 20px;
    height: auto;
}

    .dashboard-charts-card .PE-chart-h {
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
    }

    .dashboard-charts-card .chart-heading {
        background: #e5f5ff7a;
        font-size: 16px;
        font-weight: 500;
        margin-bottom: 5px;
        padding: 10px;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

.dashboard-small-card {
    background-color: #fff;
    border: 1px Solid #CAC7C7;
    border-radius: 10px;
    box-shadow: 0px 0px 6px rgb(240 245 245 / 80%);
}

    .dashboard-small-card .header {
        background: #e5f5ff7a;
        padding: 10px;
        font-size: 16px;
        font-weight: 500;
        border-top-left-radius: 10px;
        border-top-right-radius: 10px;
    }

.card-header-H {
    position: relative;
    height: 51px;
}

.dashboard-small-card table.dataTable {
    background: #fff;
}

.dashboard-small-card .dataTables_wrapper {
    margin: 6px;
}

.dashboard-small-card table.dataTable thead {
    background: var(--sea);
}

.card-b-shadow {
    box-shadow: none !important
}

.dashboard-small-card table.dataTable thead th {
    font-size: 14px !important;
    line-height: 16px;
    padding: 0.77rem;
}

.dashboard-small-card .table td, .table th {
    font-size: 14px !important;
}

.edit-add-btn {
    background: var(--sea);
    color: #fff;
    width: auto;
    height: 40px;
    line-height: 11px;
}

    .edit-add-btn:hover {
        color: #fff !important;
    }

.sign-w {
    width: auto;
}

.safety-certi .custom-control-label {
    left: 20px;
}

.table-tbody-border {
    border: 1px solid rgba(0,0,0,.125);
    border-radius: 8px;
}

.safety-cert-input {
    width: auto;
    max-width: auto;
}

.table thead th {
    border: 0px !important
}

.viewAssess .card-body {
    padding: 10px;
}

.viewAssess-form select,
.viewAssess-form input {
    max-width: 100% !important;
}

.viewAssesss-search {
    background:var(--sea);
    color: #fff;
    width: 130px;
    height: 40px;
    line-height: 11px;
    font-size: 17px;
}

    .viewAssesss-search:hover {
        color: #fff;
    }


.viewAssess-comnt .comnt-head {
    margin-top: 1px;
}

.viewAssess-sign {
    border-bottom: 1px dashed #ccc;
    margin-bottom: 9px;
}

.viewAssess-card .card-body select {
    max-width: 100% !important;
}

.card-header-inner select,
.card-header-inner input {
    max-width: 100% !important;
}

.AssessDetails label {
    margin-bottom: 0px
}

.expired-txt {
    color: red;
    position: absolute;
    bottom: 0px
}

.assesssdetail-table {
    background: #ffff;
    padding-bottom: 10px;
    font-weight: 500;
    border-bottom-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
}

    .assesssdetail-table table {
        width: 98%;
        margin: auto;
        border-bottom: 1px solid #000000;
    }

        .assesssdetail-table table tbody {
            box-shadow: none !important;
        }

    .assesssdetail-table .table td,
    .table th {
        border-top: 1px solid #000000;
    }

        .assesssdetail-table .table td .badge-pill {
            box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);
        }

    .assesssdetail-table table thead {
        height: 70px;
    }

    .assesssdetail-table table tr td i.fa {
        font-size: 20px !important;
    }

.assesssdetail-table table tr td span i.fa-comment {
    font-size: 20px !important;
    color: #000 !important;
    font-weight: 500;
}

    .assesssdetail-table table tr td span i.fa-comment span {
        font-family: 'Roboto', sans-serif !important;
        font-size: 15px;
        color: #000;
        margin-top: 3px;
    }

.comments-para {
    padding-left: 35px;
    font-family: 'Roboto', sans-serif !important;
    font-size: 15px;
    color: #000 !important;
}

.assessdetail-inner-card {
    background: #fff;
    border-bottom-left-radius: 6px !important;
    border-bottom-right-radius: 6px !important;
}

    .assessdetail-inner-card h2 {
        font-size: 16px;
        font-weight: 600;
        padding: 20px 20px 20px 12px;
        border-bottom: 1px solid #CCCCCC;
    }

    .assessdetail-inner-card .card-body {
        padding: 10px 16px;
        box-shadow: none !important;
        border-bottom-left-radius: 6px !important;
        border-bottom-right-radius: 6px !important;
    }

        .assessdetail-inner-card .card-body table tbody {
            box-shadow: none !important;
        }

            .assessdetail-inner-card .card-body table tbody tr td {
                border: none;
            }

        .assessdetail-inner-card .card-body .inovo-prgrm-name {
            border-radius: 0px;
        }

/***********************************************************************/

.PE-halfchart-l-block {
    width: 80%;
    height: 200px;
}

.PE-halfchart-r-block {
    width: 30%;
}

.PE-roundedchart-l-block {
    width: 80%;
    height: auto;
}

.PE-roundedchart-r-block {
    width: 30%;
}

.PE-select select {
    max-width: 100%;
}

.PE-lable-h {
    height: 22px;
}

.PE-cancel {
    border: 1px solid #CCCCCC;
    background: #fff;
    color: #000;
    min-width: 104px;
    display: flex;
    margin-right: 6px;
    align-items: center;
    height: 40px;
    border-radius: 8px !important;
    justify-content: center;
    box-shadow: none;
}


.filter-btns input {
    margin-left: 5px !important;
}

.PE-detail-box-bg-total {
    background: rgba(64, 126, 201, 0.1);
    border: 0.5px solid #407EC9;
}

.PE-detail-box-bg-sch {
    background: rgba(237, 139, 0, 0.1);
    border: 0.5px solid #ED8B00;
}

.PE-detail-box-bg-sub {
    background: #F5F5FB;
    border: 0.5px solid #3F3FAA;
}

.PE-detail-box-bg-app {
    background: rgba(45, 163, 130, 0.1);
    border: 0.5px solid #2DA382;
}

.PE-complete-box-bg-app {
    background: rgba(94, 186, 98, 0.1);
    border: 0.5px solid #5EBA62;
}

.PE-incomplete-box-bg-app {
    background: rgba(255, 100, 0, 0.05);
    border: 0.5px solid #FF6400;
}

.PE-detail-box-bg-rej {
    background: rgba(234, 67, 53, 0.1);
    border: 0.5px solid #EA4335;
}

.PE-detail-box-bg-draft {
    background: rgba(88, 55, 208, 0.1);
    border: 0.5px solid #6F38C5;
}

.PE-detail-box {
    height: 90px;
    align-items: center;
    justify-content: center;
}

    .PE-detail-box div.inner-detail-box {
        width: 90%;
        margin: auto;
        justify-content: start;
        align-items: center;
    }

    .PE-detail-box div img {
        height: 40px;
        padding-right: 3px;
    }


.PE-detail-box span:first-child {
    font-size: 19px;
    font-weight: 500;
    color: #5c5a5a;
    display: block;
    line-height: 24px;
}

.PE-detail-box span:nth-child(2) {
    font-size: 19px;
    font-weight: bold;
    font-weight: 700;
    color: #000;
    display: block;
}

.PE-detail-box .range-counter {
    width: 80%;
}

    .PE-detail-box .range-counter span {
        display: block;
        text-align: right !important;
        font-weight: bold !important;
        font-size: 30px !important;
        color: #979595 !important;
    }

.PE-detail-table {
    border-radius: 10px;
    border: 1px solid #CCCCCC;
}

    .PE-detail-table thead {
        white-space: nowrap;
        font-size: 14px;
        font-weight: 600;
    }

        .PE-detail-table thead tr th {
            padding: 0.95rem .55rem
        }

    .PE-detail-table table.dataTable {
        margin-top: 0px !important;
    }

    .PE-detail-table .dataTables_scroll {
        background: #343a40 !important;
        border-radius: 10px !important;
        padding-right: 0px !important;
    }

    .PE-detail-table .dataTables_scrollBody {
        background: #f3f3f3;
    }

.schedule-toggle .slider {
    color: #fff;
    line-height: 32px;
    margin-bottom: 0px;
    text-align: center;
}

.schedule-modal {
    height: 96%;
}

.btn-font {
    font-size: 0.97rem !important
}

.manage-tabs li a br {
    display: none;
}
/****************************certificate css******************/
.certi-download-btn {
    background:var(--sea);
    color: #fff;
    width: 204px;
    height: 40px;
    line-height: 11px;
}

.certi-wrapper {
    background-image: url(/Content/Images/certi-bg.jpg);
    background-size: 100% 100%;
    background-repeat: no-repeat;
    width: 100%;
    height: 423px;
    padding: 45px;
    display: flex;
    flex-flow: column;
    justify-content: space-between;
}

.certi-wrapper-inner {
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 95%;
    margin: auto;
    padding-top: 13px;
}

.certi-wrapper h2 {
    color: #ec5f29;
    font-size: 1.8rem;
}

.certi-wrapper p {
    font-family: "Times New Roman",serif;
    font-style: italic;
    font-weight: 300;
    line-height: 21px;
    font-size: 17px;
    color: #06478c;
    width: 85%;
    margin: 0 auto;
}

.certi-wrapper .post {
    font-weight: 500;
    font-size: 17px;
    color: #06478c;
}

.dashboard-card .col-xl-2, .dashboard-card .col-md-4, .dashboard-card .col-6 {
    padding-left: 15px;
    padding-right: 15px
}

.dashboard-small-card table.dataTable thead .sorting:before, .dashboard-small-card table.dataTable thead .sorting_asc:before, .dashboard-small-card table.dataTable thead .sorting_desc:before {
    left: 126px !important;
}

.dashboard-small-card table.dataTable thead .sorting:after, .dashboard-small-card table.dataTable thead .sorting_asc:after, .dashboard-small-card table.dataTable thead .sorting_desc:after {
    left: 136px !important;
}
/****************************certificate css******************/
/******css added 20 Jan 20223***************/
select.country-opt {
    border: 1px solid #aaa;
    height: 40px;
    border-radius: 6px;
    width: 100%;
    display: block;
}

.country-opt .ms-choice {
    border: 1px solid #c9c8c8;
    height: 40px;
    border-radius: 6px;
}

td.edit-assess-content {
    background: rgba(0,0,0,.05) !important
}

    td.edit-assess-content .Assrefheard {
        font-weight: bold;
    }

    td.edit-assess-content table {
        border: 0px !important;
        width: 100% !important;
    }

        td.edit-assess-content table tbody {
            background: #fff !important;
        }

            td.edit-assess-content table tbody tr {
                background: #fff !important;
            }

                td.edit-assess-content table tbody tr td {
                    border: 0px !important;
                }

.edit-assess-txtarea {
    width: 100%;
    max-width: 100%;
}

.edit-assess-upload {
    background: #17a2b8;
    height: 29px;
    line-height: 16px;
    font-size: 14px;
    color: #fff;
}

    .edit-assess-upload:hover {
        background: #17a2b8;
        height: 29px;
        line-height: 16px;
        font-size: 14px;
        color: #fff;
    }

.btn.focus, .btn:focus {
    box-shadow: none !important
}

table.edit-attachment tr td {
    border-top: 0px;
    padding: .25rem;
    word-break: break-all;
}

    table.edit-attachment tr td:nth-child(1) a {
        text-decoration: underline;
        font-size: 13px;
        color: #8b8686 !important;
    }

    table.edit-attachment tr td:nth-child(1) {
        width: 80%;
    }

    table.edit-attachment tr td:nth-child(2) .fa {
        justify-content: end !important;
        font-size: 17px !important;
        min-height: auto !important;
        color: #8b8686 !important;
    }

div.attachment-border {
    border-bottom: 1px solid #dee2e6;
    padding-bottom: 12px !important;
    display: flex;
    justify-content: center;
    align-items: center
}

span.assess-detail-download .fa {
    background: #fff;
    color: #407ec9 !important;
    font-size: 18px !important;
    cursor: pointer;
}

[type="file"] {
    color: #fff;
    max-width: 100% !important;
}

.edit-assess-input {
    font-size: 13px;
    border-radius: 4px;
    line-height: 15px;
    height: 43px;
}

[type="file"]::-webkit-file-upload-button {
    background: #cfcfcf;
    border: 2px solid #cfcfcf;
    border-radius: 4px;
    color: #000;
    cursor: pointer;
    font-size: 12px;
    font-weight: bold;
    outline: none;
    padding: 5px 25px;
    letter-spacing: 0.5px;
    transition: all 1s ease;
}
/******************upload file*********************/

.upload-outer ::file-selector-button {
    color: #ffff;
    background-color:var(--sea) !important;
    height: 35px !important;
    width: 200px;
    border: 0px !important;
    font-size: 15px;
    border-radius: 8px !important;
    text-indent: 10px;
    font-weight: normal;
    box-shadow: 0 3px 7px rgb(0 0 0 / 0.2);
}

.fa.upload-icon {
    position: absolute;
    font-size: 22px !important;
    background: #fff;
    left: -9px;
    top: -1px;
    color: #407ec9 !important;
    border: 2px solid #407ec9;
    min-width: 37px !important;
    min-height: 37px !important;
}

.upload-outer {
    padding: 10px;
    height: auto;
    border: 1px dashed #ced4da;
    display: flex;
    justify-content: center;
    border-radius: 5px;
    position: relative;
}

    .upload-outer .upload-heading {
        position: absolute;
        top: -10px;
        background: #fff;
        font-size: 16px;
    }

.alert {
    padding: .05rem 1.25rem;
}

    .alert strong {
        color: #000 !important;
        line-height: 11px;
    }

    .alert .fa {
        color: #000 !important;
    }

.tooltip1 {
    position: relative;
    display: block;
}

    .tooltip1 .tooltiptext {
        visibility: hidden;
        width: 200px;
        background-color: white;
        color: #000;
        text-align: center;
        border-radius: 6px;
        padding: 5px 0;
        position: absolute;
        z-index: 1;
        bottom: -10px;
        left: 100%;
        font-size: 12px;
        box-shadow: 0px 5px 18px #575353;
        opacity: 0;
        transition: opacity 1s;
        line-height: 18px;
        white-space: normal !important;
    }

.tooltip-w {
    width: 120px !important
}

.tooltip1 .tooltiptext::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 100%;
    margin-top: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: transparent white transparent transparent;
    box-shadow: 0px 5px 18px #575353;
}

.tooltip1:hover .tooltiptext {
    visibility: visible;
    opacity: 1;
}

.fa.tsr-info2 {
    color: #fff !important;
    font-size: 18px !important;
    min-height: auto !important;
}

.fa.tsr-info {
    color: #fff !important;
    font-size: 18px !important;
    min-height: auto !important;
}

    tbody.cirle-warn-icon .fa.warn-icon {
        display: initial !important;
    }

tbody.cirle-warn-icon1 .fa.warn-icon {
    display: initial !important;
    /*float:right*/
}

.note-highlights {
    display: flex;
    align-items: center;
}

    .note-highlights .fa, tbody.cirle-warn-icon .fa.warn-icon, tbody.cirle-warn-icon1 .fa.warn-icon {
        background: transparent !important;
        min-width: auto !important;
        min-height: auto !important;
        font-size: 17px !important;
        padding: 0px 3px 0px 10px !important;
    }

    .note-highlights .text-success, tbody.cirle-warn-icon .text-success, tbody.cirle-warn-icon1 .text-success {
        color: #28a745 !important
    }

    .note-highlights .text-warning, tbody.cirle-warn-icon .text-warning, tbody.cirle-warn-icon1 .text-warning {
        color: #ffc107 !important;
    }

    .note-highlights .text-danger, tbody.cirle-warn-icon .text-danger, tbody.cirle-warn-icon1 .text-danger {
        color: #dc3545 !important
    }

.am-pm-values {
    width: 90%;
    height: 32px;
    min-width: 221px;
    margin-right: 10px;
}

.not-appl {
    position: relative;
    top: 4px;
    margin-bottom: 0px
}
/*************************************************************** css end***************************************************************/
/***************************************************************Responsive css***************************************************************/


@media screen and (max-width:1199px) {

    .dashboard-charts-card {
        height: auto;
    }

    .extended-micro table tbody tr td.plate-loc input {
        width: 250px;
    }

    .extended-micro table tbody tr td.plate-type select {
        width: 150px;
    }

    table.hatchery-w tbody td input.form-control {
        width: 165px !important;
        max-width: 165px !important;
    }

    .ack-carousel-control-next {
        right: -33px
    }

    .ack-carousel-control-prev {
        left: -33px
    }

    .ack-carousel-control-next .fa {
        min-width: 28px;
        min-height: 28px;
        font-size: 18px !important;
    }

    .ack-carousel-control-prev .fa {
        min-width: 28px;
        min-height: 28px;
        font-size: 18px !important;
    }
}

@media screen and (min-width:768px) and (max-width:1199px), (max-width:599px) {
    .PE-halfchart-l-block {
        width: 100%;
    }

    .PE-halfchart-r-block {
        width: 100% !important;
    }

    .PE-roundedchart-l-block {
        width: 100%;
    }

    .PE-roundedchart-r-block {
        width: 100% !important;
    }

    .PE-roundedchart-l-block svg rect.highcharts-plot-background {
        height: 200px !important;
    }
}

@media screen and (min-width:600px) and (max-width:767px) {
    .display-f {
        display: flex !important;
    }

    .PE-halfchart-l-block {
        width: 80%;
        height: 200px;
    }

    .PE-halfchart-r-block {
        width: 30%;
    }

    .PE-roundedchart-l-block {
        width: 80%;
        height: auto;
    }

    .PE-roundedchart-r-block {
        width: 30%;
    }
}

@media screen and (max-width:767px) {
    .select-w-100 {
        width: 100px !important
    }

    .table-responsive table thead {
        white-space: nowrap;
    }

    .tooltip-inner {
        max-width: 100%;
        width: 100%;
    }

    .tooltip {
        max-width: 74%;
        width: 74%;
        left: -70px;
    }

    .PE-card-mb-20 {
        margin-bottom: 20px
    }

    .row1 .card-body {
        min-height: auto !important;
    }

    .srch {
        max-width: 100%;
        width: 80%;
        margin: auto !important;
    }

    .viewAssessTab .cntrl-prgm tr td:nth-child(2), .viewAssessTab1 .cntrl-prgm tr td:first-child,
    .assesssdetail-table table tbody tr td:nth-child(1) {
        width: 410px;
        display: block;
    }

    .edit-schedule-model select,
    .edit-schedule-model input {
        max-width: 100% !important;
        width: 100%
    }

    .pro-table thead {
        white-space: nowrap;
    }

    .certi-wrapper h2 {
        font-size: 1.7rem;
    }
}

@media screen and (max-width:576px) {
    .srch {
        max-width: 100%;
        width: 60%;
        margin: auto !important;
    }

    .viewAssess-toggle {
        display: flex;
        flex-direction: row;
        align-items: center;
    }

        .viewAssess-toggle div:first-child {
            width: 150px;
        }

        .viewAssess-toggle .lbl-box1 {
            height: 38px;
            margin-left: 11px;
        }

    .viewAssess-card h2 .btn {
        padding-top: 0px;
        padding-bottom: 0px;
    }

    .viewAssess-card h2 .scoretext {
        padding-top: 3px;
        padding-bottom: 8px;
    }

    table.report-pe tbody tr td:first-child {
        width: 80% !important;
        max-width: 80% !important;
    }
}

@media screen and (max-width:575px) {
    .nav-item-w {
        max-width: 100% !important;
        width: 100% !important;
    }

    .certi-wrapper {
        padding: 45px 24px !important;
    }

        .certi-wrapper p {
            font-size: 14px !important;
        }

        .certi-wrapper h2 {
            font-size: 1rem !important;
            margin-bottom: 5px !important;
        }

        .certi-wrapper .post {
            font-size: 15px;
        }
}


@media screen and (max-width:550px) {
    .one-header {
        width: 100%;
    }

    .viewAssess-card .card-header h2 {
        display: block;
    }

    h5.modal-title {
        font-size: 1rem;
    }

    button.close {
        width: 25px !important;
        height: 25px;
        font-size: 1.3rem;
    }

        button.close span {
            left: 4px;
        }

    .close img {
        width: 25px !important;
    }

    #vendor .accordion .card-body {
        padding: 10px;
    }

    li span.cust-oper-info {
        width: 100%;
        display: block
    }

    .collapseattende {
        width: 100%;
    }
}

@media screen and (max-width:420px) {
    .dashboard-card .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }

        .dashboard-card .col-6 .inner-detail-box .pl-3 {
            padding-left: 4rem !important;
        }

        .dashboard-card .col-6 .inner-detail-box .pr-3 {
            padding-right: 1rem !important;
        }

    .certi-wrapper .post {
        font-size: 13px;
    }

    .viewAssesss-search {
        width: 100%;
    }

    .btn-full-width, .certi-download-btn {
        width: 100%;
        max-width: 100%;
    }

    .filter-btns {
        display: block !important;
    }

        .filter-btns input {
            margin-left: 0px !important;
            margin-bottom: 8px !important
        }

    .cust-oper-tab {
        display: block !important;
    }

        .cust-oper-tab button {
            float: right;
            margin-top: 5px;
        }

        .cust-oper-tab span.w-50 {
            width: 100% !important;
        }
}

@media screen and (max-width:440px) {
    #vendor .accordion .card-header.collapsed:after {
        right: 12px;
    }

    #vendor .accordion .card-header:after {
        right: 12px;
    }

    .manage-tabs li a.nav-link {
        font-size: 12px;
        margin-right: 3px;
    }

    .ack-carousel-control-next {
        right: -20px
    }

    .ack-carousel-control-prev {
        left: -20px
    }
}


@media screen and (max-width:380px) {
    .viewAssess-comnt .comnt-head {
        font-size: 13.5px;
        margin-right: 3px;
    }

    .viewAssess-comnt .fa {
        min-width: 30px;
        min-height: 30px;
        font-size: 19px !important;
    }

    .manage-tabs li a.nav-link {
        font-size: 11px;
    }
}

@media screen and (max-width:340px) {
    .dashboard-card .col-6 .inner-detail-box .pl-3 {
        padding-left: 3rem !important;
    }
}

@media screen and (min-width:768px) {

    .schedule-modal .modal-dialog {
        max-width: 700px;
    }
}

@media screen and (max-width:720px) {
    .manage-tabs li a.nav-link {
        height: 56px !important;
        line-height: 18px !important;
    }

    .manage-tabs li a br {
        display: block;
    }

    .operator-ack-tab {
        width: auto;
    }

    li.operator-ack-tab a.nav-link {
        line-height: 35px !important;
    }
}

@media screen and (max-width:620px) {

    li.safetynav {
        width: 50%
    }

    .certi-wrapper h2 {
        font-size: 1.5rem;
    }

    .certi-wrapper {
        padding: 45px 40px;
    }

    .certi-wrapper-inner {
        width: 100%;
    }

    .certi-wrapper p {
        width: 98%
    }
}
/***************************************table list view**************************************/
@media screen and (max-width:800px) {
    .sign2 {
        width: 80%;
    }


    .listview-data table, .listview-data1 table, .listview-data2 table, .listview-data3 table, .listview-data-upcoming table, .listview-data-pe table,
    .listview-data thead, .listview-data1 thead, .listview-data2 thead, .listview-data3 thead, .listview-data-upcoming thead, .listview-data-pe thead,
    .listview-data tbody, .listview-data1 tbody, .listview-data2 tbody, .listview-data3 tbody, .listview-data-upcoming tbody, .listview-data-pe tbody,
    .listview-data th, .listview-data1 th, .listview-data2 th, .listview-data3 th, .listview-data-upcoming th, .listview-data-pe th,
    .listview-data td, .listview-data1 td, .listview-data2 td, .listview-data3 td, .listview-data-upcoming td, .listview-data-pe td,
    .listview-data tr, .listview-data1 tr, .listview-data2 tr, .listview-data3 tr, .listview-data-upcoming tr, .listview-data-pe tr {
        display: block;
    }

    .listview-data-upcoming th, listview-data-pe th, .listview-data th, .listview-data1 th, .listview-data td, .listview-data1 td, .listview-data2 th, .listview-data3 th, .listview-data2 td, .listview-data3 td {
        padding: 10px 20px;
    }

    .listview-data table thead tr, .listview-data-upcoming table thead tr, .listview-data-pe table thead tr, .listview-data1 table thead tr, .listview-data2 table thead tr, .listview-data3 table thead tr {
        display: none;
    }

    .listview-data table tbody tr, .listview-data-upcoming table tbody tr, .listview-data-pe table tbody tr, .listview-data1 table tbody tr, .listview-data2 table tbody tr, .listview-data3 table tbody tr {
        border-top: 1px solid #aba9a9
    }

        .listview-data table tbody tr:first-child, .listview-data-pe table tbody tr:first-child, .listview-data-upcoming table tbody tr:first-child, .listview-data1 table tbody tr:first-child, .listview-data2 table tbody tr:first-child, .listview-data3 table tbody tr:first-child {
            border: 0px
        }

    .listview-data table tbody td, .listview-data-pe table tbody td, .listview-data-upcoming table tbody td, .listview-data1 table tbody td, .listview-data2 table tbody td, .listview-data3 table tbody td {
        display: flex;
        border: 0px;
        text-shadow: none;
    }

    .listview-data table td:nth-of-type(1):before {
        content: "Certification Date ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data table td:nth-of-type(2):before {
        content: "Customer";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data table td:nth-of-type(3):before {
        content: " Site Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data table td:nth-of-type(4):before {
        content: " User Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data table td:nth-of-type(5):before {
        content: " Role ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-upcoming table td:nth-of-type(1):before {
        content: " Expiration Date ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-upcoming table td:nth-of-type(2):before {
        content: "Customer";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-upcoming table td:nth-of-type(3):before {
        content: " Site Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-upcoming table td:nth-of-type(4):before {
        content: " User Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-upcoming table td:nth-of-type(5):before {
        content: " Role ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data .dataTables_scrollBody, listview-data-pe .dataTables_scrollBody, .listview-data-upcoming .dataTables_scrollBody, .listview-data1 .dataTables_scrollBody, .listview-data2 .dataTables_scrollBody, .listview-data3 .dataTables_scrollBody {
        overflow-x: hidden !important;
    }

    .listview-data1 table td:nth-of-type(1):before {
        content: " Quarter ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data1 table td:nth-of-type(2):before {
        content: " Schedule Date ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data1 table td:nth-of-type(3):before {
        content: " Customer ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data1 table td:nth-of-type(4):before {
        content: " Site Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data1 table td:nth-of-type(5):before {
        content: " Assign To ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }



    .listview-data-pe table td:nth-of-type(1):before {
        content: " Customer ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-pe table td:nth-of-type(2):before {
        content: " Site Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data-pe table td:nth-of-type(3):before {
        content: " No. of Scheduled ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data2 table td:nth-of-type(1):before {
        content: " Evaluation Date ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data2 table td:nth-of-type(2):before {
        content: " Customer ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data2 table td:nth-of-type(3):before {
        content: " Site Name ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data2 table td:nth-of-type(4):before {
        content: " Evaluator ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data2 table td:nth-of-type(5):before {
        content: " PE Score ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(1):before {
        content: " Time Period ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(2):before {
        content: " No. Of Sites Assigned ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(3):before {
        content: " No. of PEs Scheduled ";
        width: 50%;
        font-weight: bold;
    }

    .listview-data3 table td:nth-of-type(4):before {
        content: " No. of PEs Completed ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(5):before {
        content: " MTFS ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(6):before {
        content: " MTFA ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(7):before {
        content: " MTFC ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }

    .listview-data3 table td:nth-of-type(8):before {
        content: "  Avg. Score ";
        width: 50%;
        font-weight: bold;
        text-align: left;
    }


    .PE-detail-table {
        padding: 3px;
    }
}
/***************************************table list view**************************************/
.blankassesment {
    background:var(--sea);
    color: #fff;
    width: 200px;
    height: 40px;
    line-height: 11px;
    margin-right: 10px;
    font-size: 17px;
}
/**************************************css added by Monika end******************************/
input[type='radio']:after {
    width: 24px;
    height: 24px;
    border-radius: 15px;
    position: relative;
    background-color: #fff;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid rgb(0 0 0 / 48%);
}

input[type='radio']:checked:after {
    width: 24px;
    height: 24px;
    border-radius: 15px;
    position: relative;
    background-color: var(--sea);
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid #f1f1f1;
}

.col-sm-6.col-md-4.col-lg-3.mb-3.d-flex.align-items-end input[type='radio']:after {
    width: 20px;
    height: 20px;
    border-radius: 15px;
    position: relative;
    background-color: #fff;
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid rgb(0 0 0 / 48%);
    top: -2px;
    left: -6px;
}
.col-sm-6.col-md-4.col-lg-3.mb-3.d-flex.align-items-end input[type='radio']:checked:after {
    width: 20px;
    height: 20px;
    border-radius: 15px;
    position: relative;
    background-color: var(--sea);
    content: '';
    display: inline-block;
    visibility: visible;
    border: 2px solid #f1f1f1;
    top: -2px;
    left: -6px;
}

input[type="checkbox"] {
    accent-color: var(--sea);
}
.custom-radio .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: var(--sea);
}
.custom-control-input:checked ~ .custom-control-label::before {
    color: #fff;
    border-color: var(--sea);
    background-color: var(--sea);
}
.custom-checkbox .custom-control-input:disabled:checked ~ .custom-control-label::before {
    background-color: var(--sea);
}
.dataTables_empty{
    text-align:center;
}